feat: add component to see game folder path

1 files changed, 50 insertions, 0 deletions

diff --git a/src-vue/src/views/SettingsView.vue b/src-vue/src/views/SettingsView.vue
new file mode 100644
index 00000000..dbea2ce3
--- /dev/null
+++ b/src-vue/src/views/SettingsView.vue
@@ -0,0 +1,50 @@
+<template>
+    <div class="fc_settings__container">
+        <!-- Game folder location -->
+        <h3>Manage installation</h3>
+        <el-input
+            v-model="$store.state.game_path"
+            class="w-50 m-2"
+            placeholder="Choose installation folder"
+            @click="updateGamePath"
+        >
+            <template #prepend>
+                <el-button icon="Folder" @click="updateGamePath"/>
+            </template>
+        </el-input>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "SettingsView",
+    methods: {
+        updateGamePath() {
+            console.log('TODO: update path');
+        }
+    },
+    mounted() {
+        document.querySelector('input').disabled = true;
+    }
+}
+</script>
+
+<style scoped>
+.fc_settings__container {
+    max-width: 1200px;
+    padding: 20px 30px;
+    margin: 0 auto;
+    color: white;
+}
+
+h3:first-of-type {
+    margin-top: 0;
+    margin-bottom: 1em;
+    text-transform: uppercase;
+    font-weight: unset;
+}
+
+.el-input {
+    width: 50%;
+}
+</style>