147 lines
4.2 KiB
Vue
147 lines
4.2 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue';
|
|
import Chip from 'primevue/chip';
|
|
import { convertFileSrc } from '@tauri-apps/api/core';
|
|
import { listen } from '@tauri-apps/api/event';
|
|
import { invoke } from '../invoke';
|
|
import { Feature, Package } from '../types';
|
|
import { hasFeature, needsUpdate } from '../util';
|
|
import { useI18n } from 'vue-i18n';
|
|
|
|
const { t } = useI18n();
|
|
|
|
const props = defineProps({
|
|
pkg: Object as () => Package,
|
|
showNamespace: Boolean,
|
|
showVersion: Boolean,
|
|
showCategories: Boolean,
|
|
showDescription: Boolean,
|
|
showIcon: Boolean,
|
|
});
|
|
|
|
const icon = ref('/no-icon.png');
|
|
|
|
const reloadIcons = async () => {
|
|
const src = props.pkg?.loc?.icon ?? props.pkg?.rmt?.icon;
|
|
|
|
if (src === undefined) {
|
|
icon.value = '/no-icon.png';
|
|
} else if (src.startsWith('https://')) {
|
|
icon.value = src;
|
|
} else {
|
|
const convt = convertFileSrc(src);
|
|
if (await invoke('file_exists', { path: src })) {
|
|
icon.value = convt;
|
|
} else {
|
|
icon.value = '/no-icon.png';
|
|
}
|
|
}
|
|
};
|
|
|
|
reloadIcons();
|
|
|
|
listen('reload-icons', reloadIcons);
|
|
</script>
|
|
|
|
<template>
|
|
<img
|
|
v-if="showIcon"
|
|
:src="icon"
|
|
class="self-center rounded-sm"
|
|
width="32px"
|
|
height="32px"
|
|
/>
|
|
<label class="m-3 align-middle text grow z-5 h-50px">
|
|
<div>
|
|
<span class="text-lg">
|
|
{{ pkg?.name.replaceAll('_', ' ') ?? 'Untitled' }}
|
|
</span>
|
|
<span
|
|
v-if="pkg?.rmt?.deprecated"
|
|
v-tooltip="'deprecated'"
|
|
class="pi pi-exclamation-circle ml-1 text-amber-400"
|
|
>
|
|
</span>
|
|
<span
|
|
v-if="pkg?.rmt?.nsfw"
|
|
v-tooltip="'NSFW'"
|
|
class="pi pi-exclamation-triangle ml-1 text-red-400"
|
|
>
|
|
</span>
|
|
<span
|
|
v-if="
|
|
hasFeature(pkg, Feature.ChusanHook) ||
|
|
hasFeature(pkg, Feature.Mu3Hook)
|
|
"
|
|
v-tooltip="'Hook'"
|
|
class="pi pi-wrench ml-1 text-blue-400"
|
|
>
|
|
</span>
|
|
<span
|
|
v-if="
|
|
hasFeature(pkg, Feature.Mu3IO) ||
|
|
hasFeature(pkg, Feature.ChuniIO)
|
|
"
|
|
v-tooltip="'IO'"
|
|
class="pi pi-wrench ml-1 text-green-400"
|
|
>
|
|
</span>
|
|
<span
|
|
v-if="hasFeature(pkg, Feature.Aime)"
|
|
v-tooltip="'Aime'"
|
|
class="pi pi-credit-card ml-1 text-purple-400"
|
|
>
|
|
</span>
|
|
<span
|
|
v-if="
|
|
hasFeature(pkg, Feature.GameDLL) ||
|
|
hasFeature(pkg, Feature.AmdDLL)
|
|
"
|
|
v-tooltip="'DLL'"
|
|
class="pi pi-cog ml-1 text-red-400"
|
|
>
|
|
</span>
|
|
<span
|
|
v-if="showNamespace && pkg?.namespace"
|
|
class="text-sm opacity-75"
|
|
>
|
|
{{
|
|
t('by', { namespace: pkg.namespace }).replaceAll(
|
|
' ',
|
|
' '
|
|
)
|
|
}}
|
|
</span>
|
|
<span class="m-2">
|
|
<span
|
|
v-if="showVersion && pkg?.loc?.version"
|
|
class="text-sm opacity-75"
|
|
>
|
|
{{ pkg?.loc?.version ?? '?.?.?' }}
|
|
</span>
|
|
<span
|
|
v-if="showVersion && needsUpdate(pkg)"
|
|
class="text-sm opacity-75"
|
|
>
|
|
-> {{ pkg?.rmt?.version ?? '?.?.?' }}</span
|
|
>
|
|
</span>
|
|
</div>
|
|
<div v-if="showDescription" class="text-sm opacity-75">
|
|
{{ pkg?.description || 'No description' }}
|
|
</div>
|
|
<div v-if="showCategories" class="mt-1 flex gap-1">
|
|
<span class="text-xs" v-for="c in pkg?.rmt?.categories"
|
|
><Chip :label="c"
|
|
/></span>
|
|
</div>
|
|
</label>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.p-chip {
|
|
padding: 0.4rem !important;
|
|
font-size: 0.66rem !important;
|
|
}
|
|
</style>
|