<template>
  <view class="example">
    <uni-forms ref="planFormRef" :modelValue="planFormData" validateTrigger="submit">
      <uni-forms-item label="任务进度" required label-width="105px" name="progress">
        <slider :value="planFormData.progress" step="1" show-value :block-size="20" @change="updateProgress"
          style="margin: 10px 0" />
      </uni-forms-item>
    </uni-forms>
  </view>
</template>

<script lang="ts" setup>
import { setPlanProgress } from '@/api/project-center/plan-task';
import { useEmitt } from '@/logics/mitt/useEmitt';


const planFormData = ref<{
  task_id?: string
  task_pname?: string
  progress: number
}>({
  progress: 0
})
const { emitter } = useEmitt()

//任务进度slider 改变事件
const updateProgress = async (e: { detail: { value: number } }) => {
  planFormData.value.progress = e.detail.value;
  await setPlanProgress({ progress: e.detail.value, task_id: planFormData.value.task_id! })
  setTimeout(() => {
    emitter.emit('get_task_list')
  }, 1500)

  uni.showModal({
    title: '调整成功',
    content: `是否返回计划列表`,
    success: (res: { confirm: boolean }) => {
      const { confirm } = res;
      if (confirm) {

        return uni.navigateBack()
      }
    }
  })
}

onLoad((option) => {
  planFormData.value.progress = Number(option.progress)
  planFormData.value.task_id = option.task_id
  planFormData.value.task_pname = option.task_pname
  uni.setNavigationBarTitle({
    title: `调整${option.task_pname}进度`,
  })
});
</script>

<style scoped>
.example {
  padding: 15px;
  background-color: #fff;
}
</style>