diff options
Diffstat (limited to 'src-vue/src/views')
| -rw-r--r-- | src-vue/src/views/SettingsView.vue | 66 | ||||
| -rw-r--r-- | src-vue/src/views/mods/LocalModsView.vue | 60 | ||||
| -rw-r--r-- | src-vue/src/views/mods/ThunderstoreModsView.vue | 21 |
3 files changed, 75 insertions, 72 deletions
diff --git a/src-vue/src/views/SettingsView.vue b/src-vue/src/views/SettingsView.vue index 9a92865d..e526f821 100644 --- a/src-vue/src/views/SettingsView.vue +++ b/src-vue/src/views/SettingsView.vue @@ -3,17 +3,18 @@ <el-scrollbar> <div class="fc_settings__container"> <!-- Game folder location --> - <h3>{{ $t('settings.manage_install') }}</h3> - <el-input - v-model="$store.state.game_path" - class="w-50 m-2" - :placeholder="$t('settings.choose_folder')" - @click="updateGamePath" - > - <template #prepend> - <el-button icon="Folder" @click="updateGamePath"/> - </template> - </el-input> + <div class="fc_parameter__panel"> + <h3>{{ $t('settings.manage_install') }}</h3> + <el-input + v-model="$store.state.game_path" + :placeholder="$t('settings.choose_folder')" + @click="updateGamePath" + > + <template #prepend> + <el-button icon="Folder" @click="updateGamePath"/> + </template> + </el-input> + </div> <!-- Thunderstore mods per page configuration --> <div class="fc_parameter__panel"> @@ -40,25 +41,30 @@ <language-selector/> </div> - <h3>{{ $t('settings.repair.title') }}</h3> - <el-button type="primary" @click="openRepairWindow"> - {{ $t('settings.repair.open_window') }} - </el-button> + <!-- Repair window --> + <div class="fc_parameter__panel"> + <h3>{{ $t('settings.repair.title') }}</h3> + <el-button type="primary" @click="openRepairWindow"> + {{ $t('settings.repair.open_window') }} + </el-button> + </div> - <h3>{{ $t('settings.about') }}</h3> + <!-- About section --> + <div class="fc_parameter__panel"> + <h3>{{ $t('settings.about') }}</h3> + <div class="fc_northstar__version" @click="activateDeveloperMode"> + {{ $t('settings.flightcore_version') }} {{ flightcoreVersion === '' ? 'Unknown version' : `${flightcoreVersion}` }} + </div> + </div> - <div class="fc_northstar__version" @click="activateDeveloperMode"> - {{ $t('settings.flightcore_version') }} {{ flightcoreVersion === '' ? 'Unknown version' : `${flightcoreVersion}` }} + <!-- Testing section --> + <div class="fc_parameter__panel"> + <h3>{{ $t('settings.testing') }}</h3> + <span> + {{ $t('settings.enable_test_channels') }} + <el-switch v-model="enableReleasesSwitch"></el-switch> + </span> </div> - <br /> - <br /> - UI design inspired by <el-link :underline="false" target="_blank" href="https://github.com/TFORevive/tforevive_launcher/" type="primary">TFORevive Launcher</el-link> (not yet public) - - <h3>{{ $t('settings.testing') }}</h3> - <span> - {{ $t('settings.enable_test_channels') }} - <el-switch v-model="enableReleasesSwitch"></el-switch> - </span> </div> </el-scrollbar> </div> @@ -117,8 +123,8 @@ export default defineComponent({ methods: { activateDeveloperMode() { this.developerModeClicks += 1; - if (this.developerModeClicks >= 6) { - this.$store.state.developer_mode = true; + if (this.developerModeClicks >= 6 && !this.$store.state.developer_mode) { + this.$store.commit('toggleDeveloperMode'); ElNotification({ title: this.$t('settings.dev_mode_enabled_title'), message: this.$t('settings.dev_mode_enabled_text'), @@ -180,7 +186,7 @@ h3:first-of-type { /* Parameter panel styles */ .fc_parameter__panel { - margin: 30px 0; + margin-bottom: 30px; } .fc_parameter__panel h3 { diff --git a/src-vue/src/views/mods/LocalModsView.vue b/src-vue/src/views/mods/LocalModsView.vue index 4bc870fe..2cd253ae 100644 --- a/src-vue/src/views/mods/LocalModsView.vue +++ b/src-vue/src/views/mods/LocalModsView.vue @@ -1,33 +1,35 @@ <template> - <el-scrollbar> - <div> - <p v-if="mods.length === 0">{{ $t('mods.local.no_mods') }}</p> - <el-card v-else shadow="hover" v-for="mod in mods" v-bind:key="mod.name"> - <el-switch style="--el-switch-on-color: #13ce66; --el-switch-off-color: #8957e5" v-model="mod.enabled" - :before-change="() => updateWhichModsEnabled(mod)" :loading="global_load_indicator" /> - <el-popconfirm - :title="$t('mods.local.delete_confirm')" - :confirm-button-text="$t('generic.yes')" - :cancel-button-text="$t('generic.no')" - @confirm="deleteMod(mod)" - > - <template #reference> - <el-button type="danger"> - {{ $t('mods.local.delete') }} - </el-button> - </template> - </el-popconfirm> - {{ mod.name }} - <span v-if="mod.version != null">(v{{ mod.version }})</span> - <img - v-if="mod.thunderstore_mod_string != null" - :title="$t('mods.local.part_of_ts_mod')" - src="/src/assets/thunderstore-icon.png" - class="image" - height="16" - /> - </el-card> - </div> + <!-- Message displayed if no mod matched searched words --> + <div v-if="mods.length === 0" class="noModMessage"> + {{ $t('mods.local.no_mods') }} + </div> + + <el-scrollbar v-else> + <el-card shadow="hover" v-for="mod in mods" v-bind:key="mod.name"> + <el-switch style="--el-switch-on-color: #13ce66; --el-switch-off-color: #8957e5" v-model="mod.enabled" + :before-change="() => updateWhichModsEnabled(mod)" :loading="global_load_indicator" /> + <el-popconfirm + :title="$t('mods.local.delete_confirm')" + :confirm-button-text="$t('generic.yes')" + :cancel-button-text="$t('generic.no')" + @confirm="deleteMod(mod)" + > + <template #reference> + <el-button type="danger"> + {{ $t('mods.local.delete') }} + </el-button> + </template> + </el-popconfirm> + {{ mod.name }} + <span v-if="mod.version != null">(v{{ mod.version }})</span> + <img + v-if="mod.thunderstore_mod_string != null" + :title="$t('mods.local.part_of_ts_mod')" + src="/src/assets/thunderstore-icon.png" + class="image" + height="16" + /> + </el-card> </el-scrollbar> </template> diff --git a/src-vue/src/views/mods/ThunderstoreModsView.vue b/src-vue/src/views/mods/ThunderstoreModsView.vue index 0a0b9965..5a7270df 100644 --- a/src-vue/src/views/mods/ThunderstoreModsView.vue +++ b/src-vue/src/views/mods/ThunderstoreModsView.vue @@ -3,11 +3,17 @@ <div v-if="mods.length === 0" class="fc__changelog__container">
<el-progress :show-text="false" :percentage="50" :indeterminate="true" />
</div>
+
+ <!-- Message displayed if no mod matched searched words -->
+ <div v-else-if="filteredMods.length === 0" class="noModMessage">
+ {{ $t('mods.online.no_match') }}<br/>
+ {{ $t('mods.online.try_another_search') }}
+ </div>
+
<el-scrollbar v-else class="container" ref="scrollbar">
<div class="card-container">
- <div class="pagination_container">
+ <div class="pagination_container" v-if="shouldDisplayPagination">
<el-pagination
- v-if="shouldDisplayPagination"
:currentPage="currentPageIndex + 1"
layout="prev, pager, next"
:page-size="modsPerPage"
@@ -16,12 +22,6 @@ />
</div>
- <!-- Message displayed if no mod matched searched words -->
- <div v-if="filteredMods.length === 0" class="modMessage">
- {{ $t('mods.online.no_match') }}<br/>
- {{ $t('mods.online.try_another_search') }}
- </div>
-
<!-- Mod cards -->
<thunderstore-mod-card v-for="mod of currentPageMods" v-bind:key="mod.name" :mod="mod" />
</div>
@@ -199,11 +199,6 @@ export default defineComponent({ margin: 0 0 0 10px !important;
}
-.modMessage {
- color: white;
- margin: 20px 5px;
-}
-
.card-container {
margin: 0 auto;
}
|