diff --git a/src/App.vue b/src/App.vue index b41b2bc..ce88cc6 100644 --- a/src/App.vue +++ b/src/App.vue @@ -6,7 +6,6 @@ import { onMounted } from 'vue' import { useUpdateApp } from './composables/useUpdateApp.js' const route = useRoute() -const DEV = import.meta.env.DEV onMounted(() => { useThemeColor() @@ -19,7 +18,7 @@ onMounted(() => {
- + diff --git a/src/components/configurationForm.vue b/src/components/configurationForm.vue index 50138fa..7e23dce 100644 --- a/src/components/configurationForm.vue +++ b/src/components/configurationForm.vue @@ -22,45 +22,115 @@ import { DB_SIZE_GREATER_RAM, } from '../utils/constants/configuration' import { validationSchema as schema } from '../utils/validation' +import { useRoute, useRouter } from 'vue-router' +import { calculateSettings } from '../utils/calculator' -const dbVersions = ref(DB_VERSIONS) +const route = useRoute() +const router = useRouter() -const osTypes = ref([OS_LINUX, OS_WINDOWS, OS_MAC]) +const query = route.query + +const dbVersions = ref( + DB_VERSIONS.map((version) => ({ + label: String(version), + value: version, + })), +) + +const osTypes = ref([ + { + label: 'Linux', + value: OS_LINUX, + }, + { + label: 'OS X', + value: OS_MAC, + }, + { + label: 'Windows', + value: OS_WINDOWS, + }, +]) const dbTypes = ref([ - DB_TYPE_WEB, - DB_TYPE_OLTP, - DB_TYPE_DW, - DB_TYPE_DESKTOP, - DB_TYPE_MIXED, + { + label: 'Web application', + value: DB_TYPE_WEB, + }, + { + label: 'Online transaction processing system', + value: DB_TYPE_OLTP, + }, + { + label: 'Data warehouse', + value: DB_TYPE_DW, + }, + { + label: 'Desktop application', + value: DB_TYPE_DESKTOP, + }, + { + label: 'Mixed type of application', + value: DB_TYPE_MIXED, + }, ]) const ramUnits = ref([SIZE_UNIT_TB, SIZE_UNIT_GB, SIZE_UNIT_MB]) const dataStorages = ref([ - HARD_DRIVE_HDD, - HARD_DRIVE_SSD, - HARD_DRIVE_SAN, - HARD_DRIVE_NVME, + { + label: 'NVMe storage', + value: HARD_DRIVE_NVME, + }, + { + label: 'SSD storage', + value: HARD_DRIVE_SSD, + }, + { + label: 'Network (SAN) storage', + value: HARD_DRIVE_SAN, + }, + { + label: 'HDD storage', + value: HARD_DRIVE_HDD, + }, ]) -const dataSizes = ref([DB_SIZE_LESS_RAM, DB_SIZE_MID_RAM, DB_SIZE_GREATER_RAM]) +const dataSizes = ref([ + { + label: 'Less than RAM', + value: DB_SIZE_LESS_RAM, + }, + { + label: '1x - 3x RAM', + value: DB_SIZE_MID_RAM, + }, + { + label: 'More than 3x RAM', + value: DB_SIZE_GREATER_RAM, + }, +]) const state = reactive({ - dbVersion: 18, - osType: OS_LINUX, - dbType: DB_TYPE_WEB, - totalMemory: undefined, - totalMemoryUnit: SIZE_UNIT_GB, - cpuNum: 1, - connectionNum: 100, - hdType: HARD_DRIVE_NVME, - dbSize: DB_SIZE_LESS_RAM, + dbVersion: query?.dbVersion ? parseInt(query.dbVersion) : 18, + osType: query?.osType ?? OS_LINUX, + dbType: query?.dbType ?? DB_TYPE_WEB, + totalMemory: query?.totalMemory ? parseInt(query.totalMemory) : undefined, + totalMemoryUnit: query?.totalMemoryUnit ?? SIZE_UNIT_GB, + cpuNum: query?.cpuNum ? parseInt(query.cpuNum) : 1, + connectionNum: query?.connectionNum ? parseInt(query.connectionNum) : 100, + hdType: query?.hdType ?? HARD_DRIVE_NVME, + dbSize: query?.dbSize ?? DB_SIZE_LESS_RAM, }) + +const onSubmit = async () => { + await router.push({ name: 'Index', query: { ...state } }) + console.log(calculateSettings({ ...state })) +}