import LeaderDialog from '@/views/matter/components/LeaderDialog'
import Circulate from '@/views/matter/components/Circulate'
import CardTodo from '@/views/matter/myTask/CardTodo'
import ApprovalDialog from '@/views/matter/myTask/ApprovalDialog.vue'

import matter from '@/mixins/matter'
import tableHeight from '@/mixins/tableHeight'

import { uniqueArrayObject, filterQueryList } from '@/utils/array'

import {
  getTodoList,
  getTodoCard,
  getLeaderTodoList,
  getLeaderTodoCard,
} from '@/api/process'
import { mapState } from 'vuex'
export default {
  components: {
    LeaderDialog,
    Circulate,
    CardTodo,
    ApprovalDialog,
  },
  mixins: [matter, tableHeight],
  data() {
    return {
      tableData: [],
      selectedIds: '',
      selectedList: [],
      isDisabled: true,
      isCardView: false,
      cardLoading: false,
      isShowPagination: false,
      isShowMore: false,
      currentDefKey: '',
      currentDefName: '',
      currentTaskId: '',
      currentInstId: '',
      currentLearderId: '',
      isValChange: false,
      isFrom: 'todo',
      isFocus: false,
      specialFocusTaskList: [],
      currentQuery: {},
    }
  },
  computed: {
    ...mapState('user', ['account']),
    specialFocusTaskIds() {
      return this.specialFocusTaskList.map((item) => item.id)
    },
    noSpecialFocusTasks() {
      return this.tableData.filter(
        (item) => !this.specialFocusTaskIds.includes(item.id)
      )
    },
    getCurrentTableData() {
      const currentTableData = [
        ...this.specialFocusTaskList,
        ...this.noSpecialFocusTasks,
      ]
      const listData = currentTableData.slice(0, this.pageResult.pageSize)
      return this.isCardView ? this.tableData : listData
    },
  },
  watch: {
    selectedList(val) {
      this.isDisabled = val.length < 1 ? true : false
    },
  },
  mounted() {
    if (localStorage.getItem(this.account)) {
      this.specialFocusTaskList =
        JSON.parse(localStorage.getItem(this.account)) || []
    }
  },
  methods: {
    getTodoList(data, type, cb) {
      const querys =
        this.isShowMore && this.isCardView
          ? this.getCardMoreQuerys(data)
          : data.querys
      const params = {
        ...data,
        querys: filterQueryList(querys),
      }
      this.currentQuery = params
      const currentApi = type === 'todo' ? getTodoList : getLeaderTodoList
      currentApi(params)
        .then((res) => {
          if (!res) return
          const { rows, page, pageSize, total } = res
          this.tableData = rows || []
          this.filterNotFoundSpecialFocusTask(querys)
          if (this.isShowMore) {
            this.tableData = [
              {
                key: this.currentDefKey,
                list: rows || [],
                procDefName: this.currentDefName,
              },
            ]
          }
          this.pageResult = {
            page,
            pageSize,
            total,
          }
        })
        .finally(() => {
          cb?.()
        })
    },
    filterNotFoundSpecialFocusTask(queryList) {
      const taskIds = this.tableData.map((it) => it.taskId)
      const specialFocusTaskList =
        JSON.parse(localStorage.getItem(this.account)) || []
      if (
        queryList.length > 0 &&
        specialFocusTaskList &&
        specialFocusTaskList.length > 0
      ) {
        this.specialFocusTaskList = this.specialFocusTaskList.filter((item) =>
          taskIds.includes(item.taskId)
        )
      } else {
        this.specialFocusTaskList = specialFocusTaskList
      }
    },
    handleSpecialFocus(row) {
      this.$set(row, 'isFocus', row.isFocus ? false : true)
      this.$message.success(
        row.isFocus ? '特别关注置顶成功' : '取消特别关注成功'
      )
      if (row.isFocus) {
        this.specialFocusTaskList.unshift(row)
      } else {
        this.specialFocusTaskList = this.specialFocusTaskList.filter(
          (item) => item.id !== row.id
        )
      }
      localStorage.setItem(
        this.account,
        JSON.stringify(this.specialFocusTaskList)
      )
    },
    getTodoCardList(param, type, cb) {
      this.isFrom = type
      this.cardLoading = true
      const cardPageBean = {
        page: 1,
        pageSize: 10e6,
        total: 0,
      }
      const data = {
        ...param,
        pageBean: cardPageBean,
      }
      const currentApi = type === 'todo' ? getTodoCard : getLeaderTodoCard
      currentApi(data)
        .then((res) => {
          if (res.state) {
            const cardObj = res.value
            let cardList = []
            for (const key in cardObj) {
              if (Object.hasOwnProperty.call(cardObj, key)) {
                cardList.push({
                  key,
                  count: type === 'todo' ? '' : cardObj[key].num,
                  list: type === 'todo' ? cardObj[key] : cardObj[key].taskList,
                  procDefName:
                    type === 'todo'
                      ? cardObj[key][0]?.procDefName
                      : cardObj[key].taskList[0]?.procDefName,
                })
              }
            }
            this.tableData = cardList
          }
        })
        .finally(() => {
          this.cardLoading = false
          cb?.()
        })
    },
    handleViewChange(val) {
      this.isCardView = val
      this.isShowPagination = false
      this.pageResult = {
        page: 1,
        pageSize: 20,
        total: 0,
      }
      this.$nextTick(() => {
        this.$refs.htTable.load(false)
      })
      if (val) {
        this.getTodoCardList(this.currentQuery, this.isFrom)
        this.isShowPagination = true
      } else {
        this.isShowMore = false
      }
    },
    handleClickMore(item, type) {
      this.isShowMore = true
      this.currentDefKey = item.procDefKey
      this.currentDefName = item.procDefName
      this.isShowPagination = false
      this.getTodoListByDefKey(type)
    },
    getTodoListByDefKey(type) {
      const params = {
        pageBean: this.pageResult,
        querys: this.getCardMoreQuerys({}),
      }
      const currentApi = type === 'todo' ? getTodoList : getLeaderTodoList
      currentApi(params).then((res) => {
        const { rows, page, pageSize, total } = res
        this.tableData = [
          {
            key: this.currentDefKey,
            list: rows || [],
            procDefName: this.currentDefName,
          },
        ]
        this.pageResult = {
          page,
          pageSize,
          total,
        }
      })
    },
    getCardMoreQuerys(params) {
      let query = params?.querys || []
      query.push({
        property: 'bt.proc_def_key_',
        value: this.currentDefKey,
        group: 'main',
        operation: 'LIKE',
        relation: 'AND',
      })
      return query
    },
    handleCardBack(cb) {
      this.loadData({ isBack: true }, cb)
      this.isShowPagination = true
    },
    handleCheckboxChange(data) {
      const checkedList = data.filter((it) => it.checked)
      this.selectedList = uniqueArrayObject(checkedList, 'id')
      this.selectedIds = this.selectedList?.map((item) => item.id)?.join(',')
    },
    handleSelectionChange(selection) {
      this.selectedIds = selection?.map((item) => item.id).join(',')
      this.selectedList = selection
    },
    handleCardClick(row, key) {
      this.jumpApproval(row, key)
    },
    handleClick(row, key) {
      this.jumpApproval(row, key)
    },
    jumpApproval(row, key) {
      const isDialogModel = localStorage.getItem('isDialog')
      if (isDialogModel && JSON.parse(isDialogModel) === true) {
        this.currentTaskId = row.id
        this.currentInstId = row.procInstId
        this.currentLearderId = row.leaderIds
        this.$refs.approvalDialogForm.openApprovalFormDialog()
      } else {
        //根据状态跳转
        this.$refs.leaderDialog.handleJumpsTodoPage(row, {
          isGetApprovalBtn: true,
          key,
          type: 'fromTodoList',
        })
      }
    },
    //传阅
    handleCirculate() {
      this.$refs.circulate.handleOpen()
    },
  },
}