added settings Page and components

pages/issueSlips.vue

@@ -25,12 +25,12 @@
       </router-link>
     </div>
     <div id="content-body">
-      <ClientSearch />
-      <IssueSlipTable />
-      <IssueSlipTableNoClient />
-      <IssueSlip />
-      <OrderingInformation />
-      <Accounting />
+      <ClientSearch v-if="onIssueSliplist || onCustomerIssueSliplist"/>
+      <IssueSlipTable v-if="onIssueSliplist"/>
+      <IssueSlipTableNoClient v-if="onCustomerIssueSliplist"/>
+      <IssueSlip v-if="onIssueSlip"/>
+      <OrderingInformation v-if="onIssueSlip"/>
+      <Accounting v-if="onIssueSlip"/>
     </div>
   </section>
 </template>
@@ -51,6 +51,11 @@ definePageMeta({
 })
 
 const darkMode = ref(true)
+
+// to render the right components
+const onIssueSliplist = ref(true)
+const onCustomerIssueSliplist = ref(false)
+const onIssueSlip = ref(false)
 </script>
   
 <script>
@@ -92,6 +97,7 @@ export default {
   letter-spacing: 5%;
   font: 400 1.5rem/125% Overpass, -apple-system, Roboto, Helvetica,
     sans-serif;
+  text-decoration: none;
 }
 
 #active-page-name {