aboutsummaryrefslogtreecommitdiff
path: root/src-vue/src/components/ModsMenu.vue
diff options
context:
space:
mode:
authorGeckoEidechse <gecko.eidechse+git@pm.me>2024-12-22 23:55:52 +0100
committerGeckoEidechse <gecko.eidechse+git@pm.me>2024-12-22 23:55:52 +0100
commitf1dee718da95836ffa5c0985c9e8f5643e0f3f6f (patch)
tree24967a28bcae1fc1e5b08da9f58bcc678ed52937 /src-vue/src/components/ModsMenu.vue
parentcc5ae684221d3165479d7a68556a2bb6fa81cf3a (diff)
downloadFlightCore-f1dee718da95836ffa5c0985c9e8f5643e0f3f6f.tar.gz
FlightCore-f1dee718da95836ffa5c0985c9e8f5643e0f3f6f.zip
dev: Replace with sample Tauri 2.0 project
as a first step to convert FlightCore to Tauri 2.0
Diffstat (limited to 'src-vue/src/components/ModsMenu.vue')
-rw-r--r--src-vue/src/components/ModsMenu.vue141
1 files changed, 0 insertions, 141 deletions
diff --git a/src-vue/src/components/ModsMenu.vue b/src-vue/src/components/ModsMenu.vue
deleted file mode 100644
index 66ecc71a..00000000
--- a/src-vue/src/components/ModsMenu.vue
+++ /dev/null
@@ -1,141 +0,0 @@
-<template>
- <nav class="fc_mods__menu">
- <el-menu
- default-active="1"
- text-color="#fff"
- >
- <h5>{{ $t('menu.mods') }}</h5>
- <el-menu-item index="1" @click="$emit('showLocalMods', true)">
- <el-icon><Folder /></el-icon>
- <span>{{ $t('mods.menu.local') }}</span>
- </el-menu-item>
-
- <!-- Display a badge if there are some outdated Thunderstore mods -->
- <el-menu-item v-if="outdatedThunderstoreModsCount !== 0" index="2" @click="$emit('showLocalMods', false)">
- <el-badge :value="outdatedThunderstoreModsCount" class="item" type="warning">
- <el-icon><Connection /></el-icon>
- <span>{{ $t('mods.menu.online') }}</span>
- </el-badge>
- </el-menu-item>
- <el-menu-item v-else index="2" @click="$emit('showLocalMods', false)">
- <el-icon><Connection /></el-icon>
- <span>{{ $t('mods.menu.online') }}</span>
- </el-menu-item>
-
- <!-- Search inputs -->
- <h5>{{ $t('mods.menu.filter') }}</h5>
- <el-input v-model="$store.state.search.searchValue" :placeholder="$t('mods.menu.search')" clearable />
- <el-select
- v-if="!showingLocalMods"
- v-model="$store.state.search.sortValue"
- :placeholder="$t('mods.menu.sort_mods')"
- >
- <el-option
- v-for="item of sortValues"
- :key="item.value"
- :label="item.label"
- :value="item.value"
- />
- </el-select>
- <el-select
- v-if="!showingLocalMods"
- v-model="$store.state.search.selectedCategories"
- multiple
- :placeholder="$t('mods.menu.select_categories')"
- >
- <el-option
- v-for="item in $store.state.thunderstoreModsCategories"
- :key="item"
- :label="item"
- :value="item"
- />
- </el-select>
-
- </el-menu>
- </nav>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-import { SortOptions } from '../utils/SortOptions.d';
-import { isThunderstoreModOutdated } from "../utils/thunderstore/version";
-import { ThunderstoreMod } from "../../../src-tauri/bindings/ThunderstoreMod";
-
-export default defineComponent({
- name: 'ModsMenu',
- props: {
- showingLocalMods: {
- required: true,
- type: Boolean
- }
- },
- mounted() {
- this.$store.state.search.sortValue = this.sortValues[3].value;
- },
- computed: {
- outdatedThunderstoreModsCount(): number {
- return this.$store.state.thunderstoreMods
- .filter((mod: ThunderstoreMod) => isThunderstoreModOutdated(mod))
- .length;
- },
- sortValues(): { label: string, value: string }[] {
- return Object.keys(SortOptions).map((key: string) => ({
- value: key,
- label: this.$t('mods.menu.sort.' + Object.values(SortOptions)[Object.keys(SortOptions).indexOf(key)])
- }));
- }
- }
-})
-</script>
-
-<style scoped>
-.fc_mods__menu {
- display: flex;
- max-width: 222px;
- min-width: 222px;
- padding: 10px;
-}
-
-.fc_mods__menu h5 {
- margin: 8px 0 16px 5px;
-}
-
-.fc_mods__menu h5:not(:first-child) {
- margin-top: 32px;
-}
-
-.fc_mods__menu > .el-menu {
- background-color: transparent;
- border: none;
- width: 100%;
-}
-
-.fc_mods__menu > .el-menu > .el-menu-item {
- height: 32px;
- margin-bottom: 5px;
- border-radius: 5px;
- color: #e2e6e7;
-}
-
-.fc_mods__menu > .el-menu > .el-menu-item:hover {
- background-color: #4e4e4e3b;
-}
-
-.fc_mods__menu > .el-menu > .el-menu-item.is-active {
- color: white;
- background-color: #4e4e4e7a;
-}
-
-.el-select {
- width: 100%;
- margin-top: 5px;
-}
-
-/* Outdated thunderstore mods count */
-.el-badge {
- width: 100%;
-}
-.el-badge:deep(.el-badge__content) {
- top: 28px !important;
-}
-</style>