fix

src/apps/contracts/components/ContractApprovalTasks.vue

@@ -1,10 +1,24 @@
 <script setup lang="ts">
 import { computed, onMounted, ref, watch } from "vue";
 import { taskApi } from "../../../generated/api";
-import type { Task, TaskListParams } from "../../../generated/models";
+import type { Employee, Task, TaskListParams } from "../../../generated/models";
 import { useModelApi } from "../../../shared/composables/useModelApi";
 import RemoteImage from "../../../shared/components/RemoteImage.vue";
 
+type ApprovalMessage = {
+  id: number;
+  author: Employee;
+  recipient: Employee;
+  text: string;
+  date: string;
+  status: string;
+  task: number;
+};
+
+type ApprovalTask = Omit<Task, "message_set"> & {
+  message_set?: ApprovalMessage[] | null;
+};
+
 const props = defineProps<{
   contractId: number;
 }>();
@@ -24,8 +38,8 @@ const expandedTasks = ref<Record<number, boolean>>({});
 
 const hasTasks = computed(() => tasks.value.length > 0);
 
-function taskTitle(task: Task) {
-  return task.text?.trim() || task.result?.trim() || `Задача #${task.id}`;
+function taskTitle(task: Task | null | undefined) {
+  return task?.text?.trim() || task?.result?.trim() || `Задача #${task?.id ?? ""}`;
 }
 
 function personName(
@@ -42,6 +56,10 @@ function personAvatar(person: { avatar_small?: string | null } | null) {
   return person?.avatar_small ?? "";
 }
 
+function taskMessages(task: Task | null | undefined) {
+  return (task as ApprovalTask | null | undefined)?.message_set ?? [];
+}
+
 function isHistoryExpanded(taskId: number) {
   return expandedTasks.value[taskId] ?? false;
 }
@@ -53,10 +71,10 @@ function toggleHistory(taskId: number) {
   };
 }
 
-function visibleMessages(task: Task) {
-  const messages = task.message_set ?? [];
+function visibleMessages(task: Task | null | undefined) {
+  const messages = taskMessages(task);
 
-  if (isHistoryExpanded(task.id)) {
+  if (isHistoryExpanded(task?.id ?? 0)) {
     return messages;
   }
 
@@ -97,7 +115,7 @@ function statusTone(statusClass: string) {
 
 function loadTasks() {
   const params = {
-    contract: props.contractId,
+    contract: String(props.contractId),
     ordering: "-id",
   } as TaskListParams;
 
@@ -212,7 +230,7 @@ onMounted(() => {
           <div class="approval-task-messages__title">Сообщения</div>
 
           <van-empty
-            v-if="!task.message_set?.length"
+              v-if="!taskMessages(task).length"
             description="Сообщений пока нет"
             image-size="64"
           />
@@ -224,14 +242,12 @@ onMounted(() => {
               :class="[
                 'approval-message-item',
                 !isHistoryExpanded(task.id) &&
-                message.id ===
-                  task.message_set?.[task.message_set.length - 1]?.id
+                  message.id === taskMessages(task)[taskMessages(task).length - 1]?.id
                   ? 'approval-message-item--latest'
                   : '',
               ]"
               @click="
-                message.id ===
-                  task.message_set?.[task.message_set.length - 1]?.id &&
+                message.id === taskMessages(task)[taskMessages(task).length - 1]?.id &&
                 !isHistoryExpanded(task.id)
                   ? toggleHistory(task.id)
                   : undefined
@@ -262,7 +278,7 @@ onMounted(() => {
             </article>
 
             <van-button
-              v-if="(task.message_set?.length ?? 0) > 1"
+              v-if="taskMessages(task).length > 1"
               class="approval-message-toggle"
               size="small"
               round