完成分享功能，TODO：批量复制功能

src/assets/styles/common.css

@@ -19,6 +19,9 @@ page {
 	src: url("https://im.oytour.com/tripfont/PingFangR.ttf") format("truetype");
 	font-display: swap;
 }
+.pingfangr{
+	font-family: "pingfangr" !important;
+}
 .block{
 	display: block;
 }
@@ -126,6 +129,9 @@ page {
 .text-primary{
 	color:#0b40fe;
 }
+.text-el-primary{
+	color: #d14424 !important;
+}
 .text-info{
 	color:#b1b7cf;
 }

src/views/SellTemplate/Share.vue

 <template>
-    <div class="q-px-md q-pt-lg column full-height">
+    <div class="q-px-md q-pt-lg column full-height" ref="currentRootDom">
         <div class="q-pl-lg row q-mb-lg">
             <div class="col row items-center q-pl-md">
                 <h5 class="row items-center">
@@ -10,7 +10,7 @@
                     </span>
                     <span class="q-pl-md" :class="[queryObj.FileId == 0 ? '' : 'row items-center']">
                         <span class="pointer" @click="clearNavigationHandler">分享</span>
-                        <breadPeeling v-if="queryObj.FileId" :navigations="navigations" @Inquire="breadPeelingInquire">
+                        <breadPeeling v-if="navigations && navigations.length>0" :navigations="navigations" @Inquire="breadPeelingInquire">
                         </breadPeeling>
                     </span>
                 </h5>
@@ -21,12 +21,39 @@
                     </el-icon>
                 </div>
             </div>
-            <div></div>
+            <div>
+                <el-button v-if="selectedItems && selectedItems.length>0">
+                    <el-icon><CopyDocument /></el-icon>
+                    <span class="">批量复制</span>
+                </el-button>
+            </div>
         </div>
         <div class="col full-width">
-            <el-table class="sample-table" :data="data" style="width: 100%" height="100%" v-loading="loading" @sort-change="sortHandler" :default-sort="{ prop: 'CreateTime', order: 'descending' }">
+            <el-table class="sample-table" @selection-change="handleSelectionChange" :data="data" style="width: 100%" height="100%" v-loading="loading" @sort-change="sortHandler" :default-sort="{ prop: 'CreateTime', order: 'descending' }">
                 <el-table-column type="selection" width="20" />
-                <el-table-column label="文档名称 " className="indentLeft" :filters="[{ text: '行程', value: '1' },{ text: '广告', value: '2' }]" :filter-method="filterFileTypeHandler" filter-placement="bottom">
+                <el-table-column className="indentLeft">
+                    <template #header>
+                        <div class="row items-center">
+                            <span>文档名称</span>
+                            <el-popover :width="200" trigger="click" @before-enter="()=>filterFileNameStatus=true" @before-leave="()=>filterFileNameStatus=false">
+                                <template #reference>
+                                    <el-icon size="14px" class="q-ml-md cusor-pointer" :class="{'text-el-primary':queryObj.FileName!=''}">
+                                        <ArrowDown v-if="!filterFileNameStatus"/>
+                                        <ArrowUp v-else/>
+                                    </el-icon>
+                                </template>
+                                <el-input v-model="tempFilterName" placeholder="请输入文档关键字" size="mini" class="full-width" />
+                                <div class="q-mt-md text-right">
+                                    <el-button link class="q-mr-sm">
+                                        <span class="text-bolder pingfangr" @click="setFilterNameHandler(0)">重置</span>
+                                    </el-button>
+                                    <el-button link type="primary">
+                                        <span class="text-bolder pingfangr" @click="setFilterNameHandler(1)">确认</span>
+                                    </el-button>
+                                </div>
+                            </el-popover>
+                        </div>
+                    </template>
                     <template #default="scope">
                         <div class="row items-center full-width" style="padding-left: 12px;">
                             <img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1708337830000_43.png" height="25" v-if="scope.row.FileType==1" />
@@ -64,7 +91,7 @@
                     </template>
                 </el-table-column>
                 <template #empty>
-                    <el-empty :image-size="150" v-if="(!data || data.length==0) && !loading" description="没有分享给我的文档" />
+                    <el-empty :image-size="150" v-if="(!data || data.length==0) && !loading" :description="(queryObj.FileId==0?'没有分享给我的文档':'文件夹里没有文件')" />
                 </template>
             </el-table>
         </div>
@@ -82,6 +109,7 @@ import CopyFile from './components/CopyFile.vue'
 import { useScreenStore, useSellTemplateStore, useSlidesStore } from "@/store";
 import { injectKeyTemplate } from "@/types/injectKey";
 import FolderService from "@/services/FolderService";
+import { ArrowDown,ArrowUp } from "@element-plus/icons-vue";
 
 const queryObj = reactive<any>({
     pageIndex: 1,
@@ -89,7 +117,9 @@ const queryObj = reactive<any>({
     pageCount: 0, //总页数
     FileType: 0,
     FileId: 0,
-    OrderByType:2
+    OrderByType:2,
+    FileName:'',
+    QShareCreateBy:0
 });
 const refreshLoading = ref(false);
 const navigations = ref<{ FileId: number; FileName: string }[]>([]);
@@ -103,6 +133,10 @@ const openCopy = ref(false)
 const copyObject = ref<any>()
 const searchData = ref({} as any);
 searchData.value = inject(injectKeyTemplate);
+const filterFileNameStatus = ref(false)
+const tempFilterName = ref('')
+const currentRootDom = ref()
+const selectedItems = ref<any[]>([])
 
 const backInquireHandler = () => {
     let Navigation = navigations.value[navigations.value.length - 2];
@@ -110,6 +144,7 @@ const backInquireHandler = () => {
     else breadPeelingInquire(0, 0);
 };
 const breadPeelingInquire = (FileId: number, index: number) => {
+    console.log(FileId,index)
     selectAll.value = false;
     selectedDatas.value = [];
     navigations.value.splice(index + 1, navigations.value.length - 1);
@@ -195,8 +230,11 @@ const sortHandler = (val:any)=>{
     queryObj.OrderByType = val=='descending'?2:1
     refreshHandler()
 }
-const filterFileTypeHandler = (val:any)=>{
-    console.log(val)
+const setFilterNameHandler = (t:0|1)=>{
+    if(!t) tempFilterName.value=''
+    queryObj.FileName=tempFilterName.value
+    currentRootDom.value.click()
+    refreshHandler()
 }
 const collectHandler = async (row:any) => {
     if(loading.value) return
@@ -227,6 +265,9 @@ const collectHandler = async (row:any) => {
     }
     loading.value=false
 }
+const handleSelectionChange = (val:any)=>{
+    selectedItems.value = val
+}
 getDocumentData()
 </script>
 <style>

src/views/SellTemplate/components/breadPeeling.vue

 <template>
-    <span class="pointer" v-for="(item,index) in navigations"
-    @click="goInquire(item.FileId,index)">
+    <span class="pointer" v-if="navigations.length>3">
+        <span class="text-info q-ml-sm">/</span>...
+    </span>
+    <template v-for="(item,index) in navigations">
+        <span class="pointer" v-if="navigations.length<4 || index>=(navigations.length-3) " @click="goInquire(item.FileId,index)">
             <span class="text-info q-ml-sm">/</span> 
             {{item.FileName}} 
         </span>
+    </template>
+    
 </template>
 <script setup lang="ts">
 import { ApiResult } from '@/configs/axios';