Files
STARTLINER/src/components/App.vue
2025-02-24 00:01:25 +00:00

143 lines
4.1 KiB
Vue

<script setup lang="ts">
import { computed, onMounted, ref } from 'vue';
import Button from 'primevue/button';
import Tab from 'primevue/tab';
import TabList from 'primevue/tablist';
import TabPanel from 'primevue/tabpanel';
import TabPanels from 'primevue/tabpanels';
import Tabs from 'primevue/tabs';
import { invoke } from '@tauri-apps/api/core';
import { listen } from '@tauri-apps/api/event';
import { onOpenUrl } from '@tauri-apps/plugin-deep-link';
import { open } from '@tauri-apps/plugin-dialog';
import ModList from './ModList.vue';
import ModStore from './ModStore.vue';
import Options from './Options.vue';
import { usePkgStore } from '../stores';
import { changePrimaryColor } from '../util';
const store = usePkgStore();
store.setupListeners();
const currentTab = ref('3');
const startEnabled = ref(false);
const loadProfile = async () => {
await store.reloadProfile();
if (store.profile === null) {
const exePath = await open({
multiple: false,
directory: false,
filters: [
{
name: 'mu3.exe' /* or chusanApp.exe'*/,
extensions: ['exe'],
},
],
});
if (exePath !== null) {
await store.initProfile(exePath);
}
}
if (store.profile !== null) {
changePrimaryColor(store.profile.game);
startEnabled.value = true;
currentTab.value = '0';
}
await store.reloadAll();
};
const isProfileDisabled = computed(() => store.profile === null);
const startline = async () => {
startEnabled.value = false;
await invoke('startline');
};
onOpenUrl((urls) => {
console.log('deep link:', urls);
});
onMounted(async () => {
await loadProfile();
});
listen('launch-end', () => {
startEnabled.value = true;
});
</script>
<template>
<main>
<Tabs lazy :value="currentTab" class="h-screen">
<div class="fixed w-full flex z-100">
<TabList class="grow">
<Tab :disabled="isProfileDisabled" value="0"
><div class="pi pi-list-check"></div
></Tab>
<Tab :disabled="isProfileDisabled" value="1"
><div class="pi pi-download"></div
></Tab>
<Tab :disabled="isProfileDisabled" value="2"
><div class="pi pi-cog"></div
></Tab>
<Tab value="3"
><div class="pi pi-question-circle"></div
></Tab>
<div class="grow"></div>
<Button
:disabled="!startEnabled"
icon="pi pi-play"
label="START"
aria-label="start"
size="small"
class="m-2.5"
@click="startline()"
/>
</TabList>
</div>
<TabPanels class="w-full grow mt-[3rem]">
<TabPanel value="0">
<ModList />
</TabPanel>
<TabPanel value="1">
<ModStore />
</TabPanel>
<TabPanel value="2">
<Options />
</TabPanel>
<TabPanel value="3">
UNDER CONSTRUCTION<br /><br />
<Button
:disabled="!isProfileDisabled"
label="Create profile"
icon="pi pi-plus"
aria-label="open-executable"
@click="loadProfile()"
/>
<img
src="/sticker-ongeki.svg"
class="fixed bottom-0 right-0"
/>
</TabPanel>
</TabPanels>
</Tabs>
</main>
</template>
<style lang="css">
@import 'tailwindcss';
.p-tablist-tab-list {
height: 3rem;
}
html,
body {
margin: 0;
padding: 0;
}
</style>