Tasks API

import tasksApi from '@/store/api/tasks'

const task = await tasksApi.getTask(taskId)

// Returns complete task object
{
  id: 'task-123',
  name: 'Animation',
  entity_id: 'asset-456',
  entity_name: 'Hero Character',
  task_type_id: 'type-789',
  task_type_name: 'Animation',
  task_status_id: 'status-wip',
  task_status_name: 'WIP',
  assignees: ['user-1', 'user-2'],
  start_date: '2024-01-10',
  due_date: '2024-01-20',
  estimation: 10, // days
  duration: 7.5,  // actual days spent
  retake_count: 1,
  priority: 2
}

const tasks = await tasksApi.getTasks({
  project_id: 'prod-123',
  task_type_id: 'type-456',
  task_status_id: 'status-wip'
})

// Returns array of task objects

const openTasks = await tasksApi.getOpenTasks({
  project_id: 'prod-123',
  person_id: 'user-456' // Optional: filter by assignee
})

const updated = await tasksApi.updateTask(taskId, {
  task_status_id: 'status-done',
  due_date: '2024-01-25',
  priority: 1
})

const result = await tasksApi.createTasks({
  project_id: 'prod-123',
  task_type_id: 'type-animation',
  type: 'assets', // 'assets', 'shots', 'sequences', 'episodes'
  entityIds: ['asset-1', 'asset-2', 'asset-3']
})

const task = await tasksApi.createTask({
  project_id: 'prod-123',
  task_type_id: 'type-animation',
  type: 'assets',
  entity_id: 'asset-456'
})

await tasksApi.deleteTask(task)

// Delete specific tasks
await tasksApi.deleteAllTasks(
  projectId,
  taskTypeId,
  ['task-1', 'task-2', 'task-3']
)

// Delete all tasks of a type
await tasksApi.deleteAllTasks(
  projectId,
  taskTypeId,
  null // null means delete all
)

const comments = await tasksApi.getTaskComments(taskId)

// Returns array of comments
[
  {
    id: 'comment-123',
    object_id: 'task-456',
    person_id: 'user-789',
    task_status_id: 'status-wip',
    text: 'Updated the animation timing',
    created_at: '2024-01-15T10:30:00Z',
    checklist: [],
    pinned: false,
    acknowledgements: [],
    attachments: [],
    previews: ['preview-1']
  },
  // ...
]

const comments = await tasksApi.commentTasks(
  projectId,
  {
    task_ids: ['task-1', 'task-2', 'task-3'],
    task_status_id: 'status-approved',
    comment: 'Batch approved'
  }
)

const updated = await tasksApi.editTaskComment({
  id: 'comment-123',
  text: 'Updated comment text',
  task_status_id: 'status-done',
  checklist: [
    { text: 'Item 1', checked: true }
  ],
  links: ['https://example.com/reference']
})

await tasksApi.deleteTaskComment(taskId, commentId)

await tasksApi.pinComment({
  id: 'comment-123',
  pinned: true // or false to unpin
})

await tasksApi.ackComment(comment)

await tasksApi.deleteReply(comment, reply)

const formData1 = new FormData()
formData1.append('file', file1)

const formData2 = new FormData()
formData2.append('file', file2)

await tasksApi.addAttachmentToComment(
  comment,
  [formData1, formData2],
  replyId // optional: attach to a reply
)

await tasksApi.deleteAttachment(comment, attachment)

const previews = await tasksApi.getTaskPreviews(taskId)

// Returns array of preview objects
[
  {
    id: 'preview-123',
    revision: 3,
    task_id: 'task-456',
    extension: 'mp4',
    width: 1920,
    height: 1080,
    duration: 5.5,
    file_size: 2048576,
    annotations: []
  },
  // ...
]

const preview = await tasksApi.addPreview({
  taskId: 'task-123',
  commentId: 'comment-456',
  revision: 3
})

const formData = new FormData()
formData.append('file', videoFile)

const { request, promise } = tasksApi.uploadPreview(
  previewId,
  formData
)

// Track upload progress
request.on('progress', e => {
  console.log(`Upload: ${e.percent}%`)
  this.uploadProgress = e.percent
})

// Wait for completion
const result = await promise

await tasksApi.addExtraPreview(
  previewId,
  taskId,
  commentId
)

await tasksApi.deletePreview(taskId, commentId, previewId)

// Set specific frame as thumbnail
await tasksApi.setPreview(entityId, previewId, frameNumber)

// Set without specific frame
await tasksApi.setPreview(entityId, previewId)

await tasksApi.setLastTaskPreviewAsEntityThumbnail(taskId)

await tasksApi.updateRevisionPreviewPosition(
  previewId,
  2 // new position (0-based)
)

const preview = await tasksApi.getPreviewFile(previewId)

await tasksApi.updatePreviewAnnotation(
  preview,
  // Additions
  [
    {
      drawing: { /* fabric.js drawing data */ },
      time: 2.5,
      text: 'Fix this area'
    }
  ],
  // Updates
  [
    {
      id: 'annotation-123',
      text: 'Updated note'
    }
  ],
  // Deletions
  ['annotation-456']
)

await tasksApi.assignTasks(
  personId,
  ['task-1', 'task-2', 'task-3']
)

// Unassign all assignees from tasks
await tasksApi.unassignTasks(['task-1', 'task-2'])

await tasksApi.unassignPersonFromTask(taskId, personId)

const isSubscribed = await tasksApi.getTaskSubscribed(taskId)

await tasksApi.subscribeToTask(taskId)

await tasksApi.unsubscribeFromTask(taskId)

const dates = await tasksApi.getPersonsTasksDates()

// Returns task date information for scheduling

<template>
  <div class="task-detail">
    <h1>{{ task.entity_name }} - {{ task.task_type_name }}</h1>
    
    <div class="task-status">
      <select v-model="selectedStatus" @change="updateStatus">
        <option 
          v-for="status in taskStatuses" 
          :key="status.id"
          :value="status.id"
        >
          {{ status.name }}
        </option>
      </select>
    </div>
    
    <div class="task-assignees">
      <person-tag 
        v-for="assignee in assignees" 
        :key="assignee.id"
        :person="assignee"
      />
    </div>
    
    <!-- Comments -->
    <div class="comments">
      <comment-item 
        v-for="comment in comments" 
        :key="comment.id"
        :comment="comment"
        @edit="handleEditComment"
        @delete="handleDeleteComment"
        @pin="handlePinComment"
        @ack="handleAckComment"
      />
    </div>
    
    <!-- New Comment Form -->
    <div class="comment-form">
      <textarea v-model="newComment" placeholder="Add a comment..." />
      
      <select v-model="newStatus">
        <option 
          v-for="status in taskStatuses" 
          :key="status.id"
          :value="status.id"
        >
          {{ status.name }}
        </option>
      </select>
      
      <input 
        type="file" 
        ref="fileInput" 
        multiple
        @change="handleFileSelect"
      />
      
      <button @click="submitComment" :disabled="!canSubmit">
        Submit
      </button>
      
      <div v-if="uploadProgress > 0" class="progress">
        Upload: {{ uploadProgress }}%
      </div>
    </div>
    
    <!-- Previews -->
    <div class="previews">
      <preview-player 
        v-for="preview in previews" 
        :key="preview.id"
        :preview="preview"
        @annotate="handleAnnotate"
      />
    </div>
  </div>
</template>

<script>
import { mapGetters, mapActions } from 'vuex'

export default {
  data() {
    return {
      newComment: '',
      newStatus: null,
      selectedFiles: [],
      uploadProgress: 0
    }
  },
  
  computed: {
    ...mapGetters([
      'task',
      'taskComments',
      'taskPreviews',
      'taskStatuses',
      'people'
    ]),
    
    taskId() {
      return this.$route.params.id
    },
    
    comments() {
      return this.taskComments(this.taskId)
    },
    
    previews() {
      return this.taskPreviews(this.taskId)
    },
    
    assignees() {
      return this.task.assignees.map(id => 
        this.people.find(p => p.id === id)
      )
    },
    
    selectedStatus: {
      get() { return this.task.task_status_id },
      set(value) { this.newStatus = value }
    },
    
    canSubmit() {
      return this.newComment.trim() || this.selectedFiles.length > 0
    }
  },
  
  methods: {
    ...mapActions([
      'loadTask',
      'loadTaskComments',
      'loadTaskPreviews',
      'addComment',
      'editComment',
      'deleteComment',
      'pinComment',
      'ackComment',
      'updateTaskStatus',
      'subscribeToTask'
    ]),
    
    handleFileSelect(event) {
      this.selectedFiles = Array.from(event.target.files)
    },
    
    async submitComment() {
      const attachments = this.selectedFiles.length > 0
        ? this.selectedFiles.map(file => {
            const fd = new FormData()
            fd.append('file', file)
            return fd
          })
        : null
      
      await this.addComment({
        taskId: this.taskId,
        taskStatusId: this.newStatus,
        comment: this.newComment,
        attachment: attachments,
        checklist: [],
        links: []
      })
      
      this.newComment = ''
      this.selectedFiles = []
      this.$refs.fileInput.value = ''
    },
    
    async updateStatus() {
      await this.updateTaskStatus({
        taskId: this.taskId,
        statusId: this.selectedStatus
      })
    },
    
    async handleEditComment(comment) {
      await this.editComment(comment)
    },
    
    async handleDeleteComment(comment) {
      if (confirm('Delete this comment?')) {
        await this.deleteComment({
          taskId: this.taskId,
          commentId: comment.id
        })
      }
    },
    
    async handlePinComment(comment) {
      await this.pinComment({
        ...comment,
        pinned: !comment.pinned
      })
    },
    
    async handleAckComment(comment) {
      await this.ackComment(comment)
    },
    
    async handleAnnotate(preview, annotations) {
      await this.updatePreviewAnnotation({
        preview,
        additions: annotations.additions,
        updates: annotations.updates,
        deletions: annotations.deletions
      })
    }
  },
  
  async mounted() {
    await Promise.all([
      this.loadTask(this.taskId),
      this.loadTaskComments(this.taskId),
      this.loadTaskPreviews(this.taskId)
    ])
    
    this.newStatus = this.task.task_status_id
    
    // Subscribe to task updates
    await this.subscribeToTask(this.taskId)
  }
}
</script>