<template>
  <div class="position-re h100 task-watch">
    <my-breadcrumb class="my-breadcrumb" :breadcrumb-arr="taskWatchDetailDetailArr"/>
    <div class="back" @click="$emit('changeDetailOperation','',{})"><span class="fa fa-reply cur-po " >返回</span></div>

    <common-layout

      :get-table-list="getTableList"
      ref="layoutRef"
      :form-attrs="{
     spanAttrs: {
       span:4
     }
     }"
      :table-header="taskWatchHomeDetailDetailHeader"
      :filter-form="taskWatchWatchDetailDetailFilterFormConfig">

    </common-layout>


  </div>
</template>

<script>
import MyBreadcrumb from "@/components/common/MyBreadcrumb.vue";
import {computed, onBeforeMount, onBeforeUnmount, ref} from "vue";
import CommonLayout from "@/components/CommonLayout.vue";
import {taskWatchHomeDetailDetailHeader} from "@/data/all-table-header";
import {taskWatchWatchDetailDetailFilterForm} from "@/data/all-forms";
import {getTaskWatchDetailDetailTableData} from "@/service/task-manage/task-watch";
import {formatDateFun} from "@/unit/time";


export default {
  name: "TaskWatchDetailDetail",
  components: {CommonLayout, MyBreadcrumb},
  props:{
    currentDetailOpObj:{

    },

  },
  setup(props){
    const taskWatchWatchDetailDetailFilterFormConfig = ref({...taskWatchWatchDetailDetailFilterForm()})
    const taskWatchDetailDetailArr = computed(() => {
      return [
        {
          name:'任务管理  ',
        },
        {
          name:'任务监控',
        },
        {
          name:formatDateFun(+new Date(props.currentDetailOpObj.TASK_DATE_START),'yyyy-MM-dd'),
        },
        {
          name:props.currentDetailOpObj.CATALOG_NAME,
        },
      ]
    })
    onBeforeMount(() => {
      let fidnK = taskWatchWatchDetailDetailFilterFormConfig.value.formItemsArr.find(i => i.modelValue === 'START_DATE')
      let fidnK2 = taskWatchWatchDetailDetailFilterFormConfig.value.formItemsArr.find(i => i.modelValue === 'END_DATE')
      fidnK.defaultValue =formatDateFun(+new Date(props.currentDetailOpObj.TASK_DATE_START),'yyyy-MM-dd')
      fidnK2.defaultValue =formatDateFun(+new Date(props.currentDetailOpObj.TASK_DATE_START),'yyyy-MM-dd')
    })
    const layoutRef = ref(null)
     function getTableList() {
      getTaskWatchDetailDetailTableData({
        pageIndex:layoutRef.value.pageIndex,
        pageSize:layoutRef.value.pageSize,
        START_DATE:layoutRef.value.form.START_DATE || '',
        END_DATE:layoutRef.value.form.END_DATE || '',
        CATALOG_CODE:props.currentDetailOpObj.CATALOG_CODE,
      }).then(res => {
        layoutRef.value.getResData(res.msg[0].Rows||[],res.msg[0].TotalRowCount)
      })
    }
    const taskWatchDetailArr = ref([])
    return {
      taskWatchDetailArr,
      getTableList,
      taskWatchHomeDetailDetailHeader,
      taskWatchWatchDetailDetailFilterFormConfig,
      layoutRef,
      taskWatchDetailDetailArr
    }
  }
}
</script>

<style scoped lang="scss">
.task-watch{
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
}
</style>
