imacat/lucia-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Files: if data length is 0, layout

Browse Source
This commit is contained in:
chiayin
2023-02-17 14:48:34 +08:00
parent 23f9d9ba15
commit 8228f9791c
2 changed files with 19 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/stores/files.js
View File

@@ -51,6 +51,7 @@ export default defineStore('filesStore', {
let filesTag = state.filesTag; let filesTag = state.filesTag;
result = result.filter(file => data[filesTag].includes(file.fileType)); result = result.filter(file => data[filesTag].includes(file.fileType));
return result; return result;
}, },
}, },

26
src/views/Files/index.vue
View File

@@ -4,7 +4,7 @@
<section class="mb-4"> <section class="mb-4">
<h2 class="font-bold py-4 mb-4 border-b border-neutral-500">Recently Used</h2> <h2 class="font-bold py-4 mb-4 border-b border-neutral-500">Recently Used</h2>
<!-- card group 最多六個--> <!-- card group 最多六個-->
<ul class="flex justify-start items-center gap-4 overflow-x-auto w-full scrollbar whitespace-nowrap pb-4"> <ul class="flex justify-start items-center gap-4 overflow-x-auto w-full h-[192px] scrollbar whitespace-nowrap pb-4">
<!-- card item v-for --> <!-- card item v-for -->
<li class="min-w-[216px] h-[168px] p-4 border rounded border-neutral-300 hover:text-primary hover:bg-primary/50 hover:border-primary duration-300" v-for="(file, index) in recentlyUsedFiles.slice(0, 6)" :key="file.id"> <li class="min-w-[216px] h-[168px] p-4 border rounded border-neutral-300 hover:text-primary hover:bg-primary/50 hover:border-primary duration-300" v-for="(file, index) in recentlyUsedFiles.slice(0, 6)" :key="file.id">
<a href="" class="h-full flex flex-col justify-between"> <a href="" class="h-full flex flex-col justify-between">
@@ -149,16 +149,18 @@
/** /**
* Read allFiles * Read allFiles
*/ */
allFiles: function(value) { allFiles: function() {
let sortFiles = Array.from(this.store.allFiles); if(this.store.allFiles.length !== 0){
let sortFiles = Array.from(this.store.allFiles);
let dataSortOrder = sortFiles.sort((x,y) => x.updated_at - y.updated_at); let dataSortOrder = sortFiles.sort((x,y) => x.updated_at - y.updated_at);
let dataSort = this.sortReverseOrder === false? dataSortOrder: dataSortOrder.reverse(); let dataSort = this.sortReverseOrder === false? dataSortOrder: dataSortOrder.reverse();
let strSortOrder = sortFiles.sort((x, y)=> x[this.sortKey].localeCompare(y[this.sortKey], 'en')); let strSortOrder = sortFiles.sort((x, y)=> x[this.sortKey].localeCompare(y[this.sortKey], 'en'));
let strSort = this.sortReverseOrder === false? strSortOrder: strSortOrder.reverse(); let strSort = this.sortReverseOrder === false? strSortOrder: strSortOrder.reverse();
return this.sortKey !== 'updated_at'? strSort: dataSort; return this.sortKey !== 'updated_at'? strSort: dataSort;
}
}, },
/** /**
* 時間排序，如果沒有 accessed_at 就不加入 data * 時間排序，如果沒有 accessed_at 就不加入 data
@@ -169,6 +171,14 @@
return recentlyUsedFiles.sort((x, y) => y.updated_at - x.updated_at); return recentlyUsedFiles.sort((x, y) => y.updated_at - x.updated_at);
}, },
}, },
watch:{
allFiles:{
handler:function(val,oldVal){
this.allFiles;
},
deep:true,
}
},
methods: { methods: {
/** /**
* switch sort * switch sort