<template>
<div class="h100">
  <common-layout
    :form-attrs="{
    spanAttrs: {
      span:4
    }
    }"
    :get-table-list="getTableList"
    ref="layoutRef"
    :filter-form="dataImputationTaskHomeFilterForm()"
    :table-header="dataImputationTaskHomeTableHeader"
    :table-attrs="{
    'has-operation':true
    }"
  >
    <template #TASK_STATES="{data}">
      {{getStatus(data.TASK_STATES)}}
    </template>
    <template #operation="{data}">
      <template v-if="!(+data.TASK_STATES)">
        <el-button type="info" @click="$emit('changeOperation','set',data)">配置</el-button>
      </template>
      <template v-else-if="(data.TASK_STATES === '1')">
        <el-button type="danger" @click="changeState(data,'4')">停用</el-button>
        <el-button type="info" @click="$emit('changeOperation','detail',data)">查看</el-button>
      </template>
      <template v-else-if="(data.TASK_STATES === '2')">
        <el-button type="danger" @click="changeState(data,'4')">停用</el-button>
        <el-button type="info" @click="$emit('changeOperation','detail',data)">查看</el-button>
      </template>
      <template v-else-if="(data.TASK_STATES === '3')">
        <el-button type="danger" @click="changeState(data,'4')">停用</el-button>
        <el-button type="info" @click="$emit('changeOperation','detail',data)">查看</el-button>
      </template>
      <template v-else-if="(data.TASK_STATES === '4')">
        <el-button type="info" @click="changeState(data,'1')">启用</el-button>
        <el-button type="info" @click="$emit('changeOperation','set',data)">配置</el-button>
      </template>
    </template>
  </common-layout>
</div>
</template>

<script>
import CommonLayout from "@/components/CommonLayout.vue";
import {dataImputationTaskHomeFilterForm} from "@/data/all-forms";
import {ref} from "vue";
import {dataImputationTaskHomeTableHeader} from "@/data/all-table-header";
import {changeDataImputationTaskHomeStatus, DataImputationTaskHomeTableData} from "@/service/data-gj/data-imputation-task";
import {handleMes} from "@/unit/element-ui/tip";
import {useActiveGetTableData} from "@/unit/use-method/usePagination";

export default {
  name: "DataImputationTaskHome",
  components: {CommonLayout},
  setup() {
    useActiveGetTableData(getTableList)
    const layoutRef = ref(null)
    function changeState(data,state) {
      changeDataImputationTaskHomeStatus({
        KETTLE_TASK_ID:data.KETTLE_TASK_ID,
        TASK_STATES:state
      }).then(res => {
         handleMes(res,() => {
           getTableList()
         })
      })
    }
    function getStatus(value) {
        switch (value) {
          case "0": return "未配置"; case "1": return "待运行"; case "2": return "执行中"; case "3": return "执行异常"; case "4": return "已停用";
        }
    }
    function getTableList() {
      DataImputationTaskHomeTableData({
        pageIndex:layoutRef.value.pageIndex,
        pageSize:layoutRef.value.pageSize,
        UNIT_CODE:layoutRef.value.form.UNIT_CODE || '',
        CATALOG_NAME:layoutRef.value.form.CATALOG_NAME || '',
        TASK_STATES:layoutRef.value.form.TASK_STATES ||'',
      }).then(res => {
        layoutRef.value.getResData(res.msg[0].Rows||[],res.msg[0].TotalRowCount)
      })

    }
    return {
      dataImputationTaskHomeFilterForm,
      layoutRef,
      dataImputationTaskHomeTableHeader,
      getTableList,
      getStatus,
      changeState
    }
  }
}
</script>

<style scoped lang="scss">

</style>
