Skip to content

Commit b6cf2bb

Browse files
author
Adelino Ngomacha
committed
feat: add File System form page
1 parent 63ca73c commit b6cf2bb

File tree

2 files changed

+248
-0
lines changed

2 files changed

+248
-0
lines changed

‎libs/components/Dashboard/Settings/Forms/FileSystemForm.vue

+246
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,246 @@
1+
<script setup lang="ts">
2+
3+
</script>
4+
5+
<template>
6+
<form>
7+
<main class="border-b border-gray-900/10">
8+
<!-- Settings forms -->
9+
<div class="divide-y divide-gray-900/10">
10+
<div class="grid max-w-7xl grid-cols-1 gap-x-8 gap-y-10 py-16 md:grid-cols-3">
11+
<div>
12+
<h2 class="text-base font-semibold leading-7 text-gray-900 dark:text-gray-100">
13+
Default File System Settings
14+
</h2>
15+
<p class="mt-1 text-sm leading-6 text-gray-600">
16+
Update your default File System settings
17+
</p>
18+
</div>
19+
20+
<div class="md:col-span-2">
21+
<div class="w-full grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
22+
<div class="sm:col-span-3">
23+
<label for="type" class="block text-sm font-medium leading-6 text-gray-900">Charset</label>
24+
<div class="mt-2">
25+
<select id="type" name="type" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:max-w-xs sm:text-sm sm:leading-6">
26+
<option selected>
27+
local
28+
</option>
29+
<option>public</option>
30+
<option>private</option>
31+
<option>efs</option>
32+
<option>s3</option>
33+
</select>
34+
</div>
35+
</div>
36+
</div>
37+
</div>
38+
</div>
39+
40+
<div class="grid max-w-7xl grid-cols-1 gap-x-8 gap-y-10 py-16 md:grid-cols-3">
41+
<div>
42+
<h2 class="text-base font-semibold leading-7 text-gray-900 dark:text-gray-100">
43+
Local Disk
44+
</h2>
45+
<p class="mt-1 text-sm leading-6 text-gray-600">
46+
Update your local disk configurations
47+
</p>
48+
</div>
49+
50+
<div class="md:col-span-2">
51+
<div class="w-full grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
52+
<div class="sm:col-span-3">
53+
<label for="local-driver" class="block text-sm font-medium leading-6 text-gray-900">Driver</label>
54+
<div class="mt-2">
55+
<input id="local-driver" type="text" name="local-driver" value="local" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
56+
</div>
57+
</div>
58+
59+
<div class="sm:col-span-3">
60+
<label for="local-root" class="block text-sm font-medium leading-6 text-gray-900">Root</label>
61+
<div class="mt-2">
62+
<input id="local-root" type="text" name="local-root" value="storage" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
63+
</div>
64+
</div>
65+
</div>
66+
</div>
67+
</div>
68+
69+
<div class="grid max-w-7xl grid-cols-1 gap-x-8 gap-y-10 py-16 md:grid-cols-3">
70+
<div>
71+
<h2 class="text-base font-semibold leading-7 text-gray-900 dark:text-gray-100">
72+
Public Disk
73+
</h2>
74+
<p class="mt-1 text-sm leading-6 text-gray-600">
75+
Update your public disk configurations
76+
</p>
77+
</div>
78+
79+
<div class="md:col-span-2">
80+
<div class="w-full grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
81+
<div class="sm:col-span-3">
82+
<label for="local-driver" class="block text-sm font-medium leading-6 text-gray-900">Driver</label>
83+
<div class="mt-2">
84+
<input id="local-driver" type="text" name="local-driver" value="public" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
85+
</div>
86+
</div>
87+
88+
<div class="sm:col-span-3">
89+
<label for="local-root" class="block text-sm font-medium leading-6 text-gray-900">Root</label>
90+
<div class="mt-2">
91+
<input id="local-root" type="text" name="local-root" value="storage/public" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
92+
</div>
93+
</div>
94+
95+
<div class="sm:col-span-2">
96+
<label for="default-config" class="block text-sm font-medium leading-6 text-gray-900">Visibility</label>
97+
<div class="flex items-center gap-x-4">
98+
<div class="mt-2">
99+
<!-- Enabled: "bg-indigo-600", Not Enabled: "bg-gray-200" -->
100+
<button
101+
type="button"
102+
class="relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent bg-indigo-600 transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2"
103+
role="switch" aria-checked="false"
104+
>
105+
<span class="sr-only">Enable Docs</span>
106+
<!-- Enabled: "translate-x-5", Not Enabled: "translate-x-0" -->
107+
<span
108+
aria-hidden="true"
109+
class="pointer-events-none inline-block h-5 w-5 translate-x-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
110+
/>
111+
</button>
112+
</div>
113+
<span class="text-sm font-medium leading-6 text-gray-900">Public</span>
114+
</div>
115+
</div>
116+
</div>
117+
</div>
118+
</div>
119+
120+
<div class="grid max-w-7xl grid-cols-1 gap-x-8 gap-y-10 py-16 md:grid-cols-3">
121+
<div>
122+
<h2 class="text-base font-semibold leading-7 text-gray-900 dark:text-gray-100">
123+
Private Disk
124+
</h2>
125+
<p class="mt-1 text-sm leading-6 text-gray-600">
126+
Update your private disk configurations
127+
</p>
128+
</div>
129+
130+
<div class="md:col-span-2">
131+
<div class="w-full grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
132+
<div class="sm:col-span-3">
133+
<label for="local-driver" class="block text-sm font-medium leading-6 text-gray-900">Driver</label>
134+
<div class="mt-2">
135+
<input id="local-driver" type="text" name="local-driver" value="private" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
136+
</div>
137+
</div>
138+
139+
<div class="sm:col-span-3">
140+
<label for="local-root" class="block text-sm font-medium leading-6 text-gray-900">Root</label>
141+
<div class="mt-2">
142+
<input id="local-root" type="text" name="local-root" value="storage/private" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
143+
</div>
144+
</div>
145+
146+
<div class="sm:col-span-2">
147+
<label for="default-config" class="block text-sm font-medium leading-6 text-gray-900">Visibility</label>
148+
<div class="flex items-center gap-x-4">
149+
<div class="mt-2">
150+
<!-- Enabled: "bg-indigo-600", Not Enabled: "bg-gray-200" -->
151+
<button
152+
type="button"
153+
class="relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent bg-gray-200 transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2"
154+
role="switch" aria-checked="false"
155+
>
156+
<span class="sr-only">Enable Docs</span>
157+
<!-- Enabled: "translate-x-5", Not Enabled: "translate-x-0" -->
158+
<span
159+
aria-hidden="true"
160+
class="pointer-events-none inline-block h-5 w-5 translate-x-0 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
161+
/>
162+
</button>
163+
</div>
164+
<span class="text-sm font-medium leading-6 text-gray-900">Private</span>
165+
</div>
166+
</div>
167+
</div>
168+
</div>
169+
</div>
170+
171+
<div class="grid max-w-7xl grid-cols-1 gap-x-8 gap-y-10 py-16 md:grid-cols-3">
172+
<div>
173+
<h2 class="text-base font-semibold leading-7 text-gray-900 dark:text-gray-100">
174+
EFS Disk
175+
</h2>
176+
<p class="mt-1 text-sm leading-6 text-gray-600">
177+
Update your EFS disk configurations
178+
</p>
179+
</div>
180+
181+
<div class="md:col-span-2">
182+
<div class="w-full grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
183+
<div class="sm:col-span-3">
184+
<label for="local-driver" class="block text-sm font-medium leading-6 text-gray-900">Driver</label>
185+
<div class="mt-2">
186+
<input id="local-driver" type="text" name="local-driver" value="local" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
187+
</div>
188+
</div>
189+
190+
<div class="sm:col-span-3">
191+
<label for="local-root" class="block text-sm font-medium leading-6 text-gray-900">Root</label>
192+
<div class="mt-2">
193+
<input id="local-root" type="text" name="local-root" value="/mnt/efs" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
194+
</div>
195+
</div>
196+
</div>
197+
</div>
198+
</div>
199+
200+
<div class="grid max-w-7xl grid-cols-1 gap-x-8 gap-y-10 py-16 md:grid-cols-3">
201+
<div>
202+
<h2 class="text-base font-semibold leading-7 text-gray-900 dark:text-gray-100">
203+
S3 Disk
204+
</h2>
205+
<p class="mt-1 text-sm leading-6 text-gray-600">
206+
Update your S3 disk configurations
207+
</p>
208+
</div>
209+
210+
<div class="md:col-span-2">
211+
<div class="w-full grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
212+
<div class="sm:col-span-3">
213+
<label for="local-driver" class="block text-sm font-medium leading-6 text-gray-900">Driver</label>
214+
<div class="mt-2">
215+
<input id="local-driver" type="text" name="local-driver" value="s3" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
216+
</div>
217+
</div>
218+
219+
<div class="sm:col-span-3">
220+
<label for="local-root" class="block text-sm font-medium leading-6 text-gray-900">Root</label>
221+
<div class="mt-2">
222+
<input id="local-root" type="text" name="local-root" value="s3" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
223+
</div>
224+
</div>
225+
</div>
226+
</div>
227+
</div>
228+
</div>
229+
</main>
230+
<div class="mt-6 flex items-center justify-end gap-x-6">
231+
<button type="button" class="text-sm font-semibold leading-6 text-gray-900">
232+
Cancel
233+
</button>
234+
<Button
235+
type="submit"
236+
class="rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
237+
>
238+
Save
239+
</Button>
240+
</div>
241+
</form>
242+
</template>
243+
244+
<style scoped>
245+
246+
</style>

‎libs/components/Dashboard/Settings/SettingsFormManager.vue

+2
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import CloudForm from './Forms/CloudForm.vue'
88
import DatabaseForm from './Forms/DatabaseForm.vue'
99
import DNSForm from './Forms/DNSForm.vue'
1010
import EmailForm from './Forms/EmailForm.vue'
11+
import FileSystemForm from './Forms/FileSystemForm.vue'
1112
1213
const props = defineProps({
1314
name: String,
@@ -126,6 +127,7 @@ const pageTitle = computed < String > (() => options.find(option => option.key =
126127
<template v-else-if="name === 'database'"><DatabaseForm /></template>
127128
<template v-else-if="name === 'dns'"><DNSForm /></template>
128129
<template v-else-if="name === 'email'"><EmailForm /></template>
130+
<template v-else-if="name === 'file-system'"><FileSystemForm /></template>
129131
<template v-else>
130132
<div class="text-center">
131133
<div class="i-heroicons-cog-8-tooth text-gray-400 w-12 h-12 dark:text-gray-200 transition-all duration-150 ease-in-out" />

0 commit comments

Comments
 (0)