FEAT: MVP

src/pages/index.vue

@@ -1,6 +1,28 @@
 <script setup>
+import { computed, defineAsyncComponent } from 'vue'
 import ConfigurationForm from '../components/configurationForm.vue'
-import DefaultDescription from '../components/defaultDescription.vue'
+import { useRoute } from 'vue-router'
+
+const route = useRoute()
+const shouldShowResultView = computed(
+  () =>
+    Object.hasOwn(route.query, 'dbVersion') &&
+    Object.hasOwn(route.query, 'osType') &&
+    Object.hasOwn(route.query, 'dbType') &&
+    Object.hasOwn(route.query, 'totalMemory') &&
+    Object.hasOwn(route.query, 'totalMemoryUnit') &&
+    Object.hasOwn(route.query, 'cpuNum') &&
+    Object.hasOwn(route.query, 'connectionNum') &&
+    Object.hasOwn(route.query, 'hdType') &&
+    Object.hasOwn(route.query, 'dbSize'),
+)
+
+const DefaultDescription = defineAsyncComponent(
+  () => import('../components/defaultDescription.vue'),
+)
+const CFV = defineAsyncComponent(
+  () => import('../components/configurationFormView.vue'),
+)
 </script>
 
 <template>
@@ -9,6 +31,7 @@ import DefaultDescription from '../components/defaultDescription.vue'
       <h3 class="text-xl font-bold">Parameters of your system</h3>
       <ConfigurationForm />
     </div>
-    <DefaultDescription />
+    <CFV v-if="shouldShowResultView" />
+    <DefaultDescription v-else />
   </div>
 </template>