feat: more options

src/components/FilePicker.vue

@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import Button from 'primevue/button';
+import InputText from 'primevue/inputtext';
+import { open } from '@tauri-apps/plugin-dialog';
+import { usePrfStore } from '../stores';
+
+const props = defineProps({
+    field: String,
+    default: String,
+    placeholder: String,
+    directory: Boolean,
+    promptname: String,
+    extension: String,
+});
+
+if (props.field === undefined || props.default === undefined) {
+    throw new Error('Invalid FilePicker');
+}
+
+const prf = usePrfStore();
+
+const cfg = prf.cfg(props.field, props.default);
+
+const filePick = async () => {
+    const res = await open({
+        multiple: false,
+        directory: props.directory,
+        filters:
+            props.promptname && props.extension
+                ? [
+                      {
+                          name: props.promptname,
+                          extensions: [props.extension],
+                      },
+                  ]
+                : [],
+    });
+    if (res != null) {
+        cfg.value =
+            /*path.relative(cfgs.current?.data.exe_dir ?? '', res) */ res;
+    }
+};
+</script>
+
+<template>
+    <Button icon="pi pi-folder-open" size="small" @click="filePick" />
+    <InputText
+        size="small"
+        :placeholder="placeholder"
+        type="text"
+        v-model="cfg"
+    />
+</template>