Merge remote-tracking branch 'origin/master' into Development

resources/js/Pages/Phone/Index.vue

@@ -1,5 +1,6 @@
 <script setup>
 import AppPhoneLayout from "@/Layouts/AppPhoneLayout.vue";
+import { Separator } from "reka-ui";
 import { computed, ref } from "vue";
 
 const props = defineProps({
@@ -11,6 +12,9 @@ const items = computed(() => props.jobs || []);
 
 // Client filter options derived from jobs
 const clientFilter = ref("");
+const listNonActivity = ref([]);
+const listActivity = ref([]);
+
 const clientOptions = computed(() => {
   const map = new Map();
   for (const job of items.value) {
@@ -28,7 +32,7 @@ const clientOptions = computed(() => {
 const search = ref("");
 const filteredJobs = computed(() => {
   const term = search.value.trim().toLowerCase();
-  return items.value.filter((job) => {
+  const filterList = items.value.filter((job) => {
     // Filter by selected client (if any)
     if (clientFilter.value) {
       const juuid = job?.contract?.client_case?.client?.uuid;
@@ -50,6 +54,9 @@ const filteredJobs = computed(() => {
       refStr.includes(term) || nameStr.includes(term) || clientNameStr.includes(term)
     );
   });
+  listNonActivity.value = filterList.filter((item) => !item.added_activity);
+  listActivity.value = filterList.filter((item) => !!item.added_activity);
+  return filterList;
 });
 
 function formatDateDMY(d) {
@@ -125,10 +132,12 @@ function getCaseUuid(job) {
             Počisti
           </button>
         </div>
-        <div class="grid grid-cols-1 gap-3 sm:gap-4 md:grid-cols-2 lg:grid-cols-3">
-          <template v-if="filteredJobs.length">
+
+        <template v-if="filteredJobs.length">
+          <h2 class="py-4">Nove / Ne obdelane</h2>
+          <div class="grid grid-cols-1 gap-3 sm:gap-4 md:grid-cols-2 lg:grid-cols-3">
             <div
-              v-for="job in filteredJobs"
+              v-for="job in listNonActivity"
               :key="job.id"
               class="bg-white rounded-lg shadow border p-3 sm:p-4"
             >
@@ -180,9 +189,6 @@ function getCaseUuid(job) {
                 <p class="text-sm text-gray-600 truncate">
                   Kontrakt: {{ job.contract?.reference || job.contract?.uuid }}
                 </p>
-                <p class="text-sm text-gray-600">
-                  Tip: {{ job.contract?.type?.name || "—" }}
-                </p>
                 <p
                   class="text-sm text-gray-600"
                   v-if="
@@ -205,14 +211,99 @@ function getCaseUuid(job) {
                 </p>
               </div>
             </div>
-          </template>
-          <div
-            v-else
-            class="col-span-full bg-white rounded-lg shadow border p-6 text-center text-gray-600"
-          >
-            <span v-if="search">Ni zadetkov za podani filter.</span>
-            <span v-else>Trenutno nimate dodeljenih terenskih opravil.</span>
           </div>
+          <h2 class="py-4">Obdelane pogodbe</h2>
+          <div class="grid grid-cols-1 gap-3 sm:gap-4 md:grid-cols-2 lg:grid-cols-3">
+            <div
+              v-for="job in listActivity"
+              :key="job.id"
+              class="bg-white rounded-lg shadow border p-3 sm:p-4"
+            >
+              <div class="mb-4 flex gap-2">
+                <a
+                  v-if="getCaseUuid(job)"
+                  :href="
+                    route('phone.case', {
+                      client_case: getCaseUuid(job),
+                      completed: props.view_mode === 'completed-today' ? 1 : undefined,
+                    })
+                  "
+                  class="inline-flex-1 flex-1 text-center px-3 py-2 rounded-md bg-blue-600 text-white text-sm hover:bg-blue-700"
+                >
+                  Odpri primer
+                </a>
+                <button
+                  v-else
+                  type="button"
+                  disabled
+                  class="inline-flex-1 flex-1 text-center px-3 py-2 rounded-md bg-gray-300 text-gray-600 text-sm cursor-not-allowed"
+                >
+                  Manjka primer
+                </button>
+              </div>
+              <div class="flex items-center justify-between">
+                <p class="text-sm text-gray-500">
+                  Dodeljeno:
+                  <span class="font-medium text-gray-700">{{
+                    formatDateDMY(job.assigned_at)
+                  }}</span>
+                </p>
+                <span
+                  v-if="job.priority"
+                  class="inline-block text-xs px-2 py-0.5 rounded bg-amber-100 text-amber-700"
+                  >Prioriteta</span
+                >
+              </div>
+              <div class="mt-2">
+                <p class="text-base sm:text-lg font-semibold text-gray-800">
+                  {{ job.contract?.client_case?.person?.full_name || "—" }}
+                </p>
+                <p class="text-sm text-gray-600">
+                  Naročnik:
+                  <span class="font-semibold text-gray-800">
+                    {{ job.contract?.client_case?.client?.person?.full_name || "—" }}
+                  </span>
+                </p>
+                <p class="text-sm text-gray-600 truncate">
+                  Kontrakt: {{ job.contract?.reference || job.contract?.uuid }}
+                </p>
+
+                <p
+                  class="text-sm text-gray-600"
+                  v-if="
+                    job.contract?.account &&
+                    job.contract.account.balance_amount !== null &&
+                    job.contract.account.balance_amount !== undefined
+                  "
+                >
+                  Odprto: {{ formatAmount(job.contract.account.balance_amount) }} €
+                </p>
+              </div>
+              <div class="mt-3 text-sm text-gray-600">
+                <p>
+                  <span class="font-medium">Naslov:</span>
+                  {{ job.contract?.client_case?.person?.addresses?.[0]?.address || "—" }}
+                </p>
+                <p>
+                  <span class="font-medium">Telefon:</span>
+                  {{ job.contract?.client_case?.person?.phones?.[0]?.nu || "—" }}
+                </p>
+              </div>
+              <div class="mt-3 text-sm text-gray-600">
+                <p>
+                  <span class="font-medium">Zadnja aktivnost:</span>
+                  {{ formatDateDMY(job.last_activity) || "—" }}
+                </p>
+              </div>
+            </div>
+          </div>
+        </template>
+        <div
+          v-else
+          class="col-span-full bg-white rounded-lg shadow border p-6 text-center text-gray-600"
+        >
+          <span v-if="search">Ni zadetkov za podani filter.</span>
+          <span v-else>Trenutno nimate dodeljenih terenskih opravil.</span>
         </div>
       </div>
     </div>