<template>
  <div class="out-div">
    <SearchComponent
      :usePage="'rectificationaudit'"
      :screenData="screenData"
      @screenDataChange="screenDataChange"
      @search="search"
      @resetScreenData="resetScreenData"/>
    <SortComponent
      :sortData="sortData"
      :screenData="screenData"
      :reject="reject"
      @rejectDataChange="rejectDataChange"
      @changeSort="changeSort"
      @collectChange="collectChange"/>
    <ShowListComponent
      :usePage="'rectificationaudit'"
      :dataList="dataList"
      :screenData="screenData"
      :sortData="sortData"
      :pageData="pageData"
      :total="total"
      @changeTask="changeTask"
      @query="query"
      @flipChange="flipChange"/>
    <PaginationComponent
      :pageData="pageData"
      :total="total"
      @changePageData="changePageData"/>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted, defineEmits } from "vue"
import SearchComponent from '@/components/illegalmining/SearchComponent/index.vue'
import SortComponent from '@/components/illegalmining/SortComponent/index.vue'
import ShowListComponent from '@/components/illegalmining/ShowListComponent/index.vue'
import PaginationComponent from '@/components/illegalmining/PaginationComponent/index.vue'
import dayjs from 'dayjs';
import { LoadRectifyingAuditTaskList } from '@/api/illegalmining/index'

const emits = defineEmits(['changeLoading','changeTask'])

const reject = ref([])
const screenData = ref({
  year: '',
  tubanlaiyuan: '',
  countyid:'',
  caseNo: '',
  type: '',
})
const sortData = ref({
  sortType: null,
  order: null,
})
const pageData = ref({
  page: 1,
  limit: 10,
})
const total = ref(0)
const dataList = ref([])

onMounted(() => {
  query()
})

const query = () => {
  let params = {
    ...pageData.value,
    ...sortData.value,
  }
  Object.keys(screenData.value).forEach(key => {
    switch(key){
      case 'time':
        if(screenData.value[key]){
          params['startTime'] = dayjs(screenData.value[key][0]).format('YYYY-MM-DD')
          params['endTime'] = dayjs(screenData.value[key][1]).format('YYYY-MM-DD')
        }
        break
      case 'nowStatus':
        if(screenData.value[key].length > 0){
          params['nowStatus'] = screenData.value[key].join(',')
        }
        break
      default:
        if(screenData.value[key] !== null && screenData.value[key] !== undefined && screenData.value[key] !== ''){
          params[key] = screenData.value[key]
        }
        break
    }
  })
  if(reject.value.length > 0){
    params['nowStatus'] = params['nowStatus']? `${params['nowStatus']},` + reject.value.join(','): '' + reject.value.join(',')
  }
  emits('changeLoading',true)
  LoadRectifyingAuditTaskList(params).then(res => {
    console.log(res)
    dataList.value = res.items
    total.value = res.total
  }).finally(() => {
    emits('changeLoading',false)
  })
}
const screenDataChange = (value, type) => {
  console.log(value,type)
  screenData.value[type] = value
}
const rejectDataChange = (value) => {
  reject.value = value
}
const search = () => {
  query()
  console.log(screenData.value)
}
const changeSort = (sortType, order) => {
  sortData.value.sortType = sortType
  sortData.value.order = order
  query()
}
const collectChange = (type) => {
  screenData.value.type = type
  pageData.value.page = 1
  query()
}
const resetScreenData = () => {
  screenData.value = {
    year: '',
    tubanlaiyuan: '',
    countyid:'',
    caseNo: '',
    type: screenData.value.type,
  }
  query()
}
const changePageData = (page, limit) => {
  pageData.value.page = page
  pageData.value.limit = limit
  query()
}
const changeTask = (id) => {
  emits('changeTask',id)
}
const flipChange = (list, totalNumber, page) => {
  dataList.value = list
  total.value = totalNumber
  pageData.value.page = page
}
</script>

<style lang="scss" scoped>

.out-div{
  height: 100%;
  display: flex;
  flex-direction: column;
  // background-color: aqua;
}
</style>
