slcing registrasi awal

registration/components/kelpelanggan_agreement.vue

@@ -0,0 +1,45 @@
+<template>
+    <div>
+        <v-card class="pa-4 rounded-lg" elevation="0">
+            <v-toolbar color="amber-lighten-5 rounded-md" density="compact">
+                <v-toolbar-title class="text-title-1 font-weight-bold">KEL. PELANGGAN DAN AGREEMENT</v-toolbar-title>
+            </v-toolbar>
+            <div class="mt-4">
+                <v-select 
+                    :items="kelpelanggan" return-object class="mb-2" hide-details="auto" color="primary"
+                    density="compact" label="Kel. Pelanggan" item-title="name" variant="outlined"
+                ></v-select>
+                <v-select 
+                    :items="agreement" return-object hide-details="auto" color="primary"
+                    density="compact" label="Agreement" item-title="name" variant="outlined"
+                ></v-select>
+            </div>
+        </v-card>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "pelangganagreementcomp",
+        components: {},
+        mounted() {},
+        data() {
+            return {
+                kelpelanggan: [
+                    { id: 1, name: "sasone 2024" },
+                    { id: 2, name: "sasone 2023" },
+                ],
+                agreement: [
+                    { id: 1, name: "mcu karyawan 2024" },
+                    { id: 2, name: "mcu karyawan 2023" }
+                ]
+            }
+        },
+        computed: {
+            
+        },
+        methods: {
+            
+        },
+    }
+</script>