You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

70 lines
1.5 KiB

<template>
<div class="icon">
<Suspense>
<FileIconImg v-if="isSvg === true" :file="file" :icon="icon" />
<FileIconIs v-else :file="file" :icon="icon" />
</Suspense>
<div v-if="extname(file?.path || '') === '.ln' || file?.isShare === true" class="ln-img">
<img :src="lnicon" alt="ln" />
</div>
<div v-if="file?.isPwd === true" class="lock-img">
<img :src="lockImg" alt="ln" />
</div>
</div>
</template>
<script setup lang="ts">
import lnicon from '@/assets/ln.png';
import lockImg from '@/assets/lock.png'
import { OsFileWithoutContent,extname } from '@/system';
// import { extname } from '../core/Path';
import { ref } from 'vue';
const props:any = defineProps<{
file?: OsFileWithoutContent | null;
icon?: string;
}>();
const isSvg = ref(true);
if(props.icon && props.icon.indexOf('.') !== -1){
isSvg.value = false;
}
if(props.file && props.file.content) {
if(typeof props.file.content === 'string') {
const end = props.file.content.split("::").pop()
if(end && end.indexOf('.') !== -1){
isSvg.value = false;
}
}
}
</script>
<style lang="scss" scoped>
.icon {
width: 100%;
height: 100%;
position: relative;
display: flex;
justify-content: center;
align-items: center;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
.ln-img {
position: absolute;
bottom: 0;
left: 0;
width: 80%;
height: 80%;
}
.lock-img {
position: absolute;
bottom: 0;
right: 0;
width: 35%;
height: 35%;
}
}
</style>