changes

resources/js/Pages/Cases/Show.vue

@@ -20,6 +20,13 @@ import DeleteDialog from "@/Components/Dialogs/DeleteDialog.vue";
 import CreateDialog from "@/Components/Dialogs/CreateDialog.vue";
 import { hasPermission } from "@/Services/permissions";
 import { Badge } from "@/Components/ui/badge";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/Components/ui/select";
 
 const props = defineProps({
   client: Object,
@@ -523,15 +530,16 @@ const submitAttachSegment = () => {
   >
     <div class="space-y-2">
       <label class="block text-sm font-medium text-gray-700">Segment</label>
-      <select
-        v-model="attachForm.segment_id"
-        class="w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500"
-      >
-        <option :value="null" disabled>-- izberi segment --</option>
-        <option v-for="s in availableSegments" :key="s.id" :value="s.id">
-          {{ s.name }}
-        </option>
-      </select>
+      <Select v-model="attachForm.segment_id">
+        <SelectTrigger class="w-full">
+          <SelectValue placeholder="-- izberi segment --" />
+        </SelectTrigger>
+        <SelectContent>
+          <SelectItem v-for="s in availableSegments" :key="s.id" :value="s.id">
+            {{ s.name }}
+          </SelectItem>
+        </SelectContent>
+      </Select>
       <div v-if="attachForm.errors.segment_id" class="text-sm text-red-600">
         {{ attachForm.errors.segment_id }}
       </div>