import { ref, onMounted, reactive, Ref, nextTick, computed } from 'vue'
import { injectModel } from '@/libs/Provider/Provider'
import { $EntityName$ } from '../Models/$EntityName$'
import { ElMessage } from 'element-plus'
import { ConfirmBox } from '@/components/ConfirmBox/ConfirmBox'
import { useFile } from './File'

interface CurrentType {
  row: any
  index: number
}
export const use$EntityName$ = (props: any, ctx?: any) => {
  const $PageMenuInstanceName$ = injectModel<$EntityName$>('$PageMenuInstanceName$')
  const { exportFile } = useFile()
  /**
   * Í·²¿ÅäÖÃ
   */
  const headers = ref({})
  /**
   * ¶¯Ì¬ÁÐÅäÖÃ
   */
  const $PageMenuInstanceName$Columns = ref>([])
  /**
   * ËÑË÷Öµ
   */
  const search = ref('')

  /**
   * ÅÅÐò
   */
  const sort = ref(0)
  /**
   * Ñ¡ÔñÏî
   */
  const selection = ref([])
  /**
   * µ±Ç°Ñ¡ÖеÄÐÐ
   */
  const current = ref(null)
  /**
   * Êý¾ÝÔ´
   */
  const dataSource: Ref = ref([])

  /**
   * ±í¸ñ
   */
  const tableRef = ref()
  const dialogConfig = reactive({
    visible: false,
    title: '',
    isAdd: false,
  })
  const dialogConfigForQuery = reactive({
    visible: false,
    title: '',
    isAdd: false,
  })


  const dialogSettingConfig = reactive({
    visible: false,
    title: '',
  })

  /**
   * ·ÖÒ³Êý¾Ý
   */
  const paginationParams = ref({})

  /**
   * ´ò¿ªÏêÇé
   * @param row
   */
  const openDetail = (row: any) => {
    current.value = row
    dialogConfig.visible = true
    dialogConfig.title = row.name
    dialogConfig.isAdd = false
    sort.value = row.sort
  }

  const contextMenu = [
    {
      label: 'Õ¹¿ªÏêÇé',
      fn: (c: CurrentType) => {
        current.value = null
        sort.value = c.row.sort
        nextTick(() => openDetail(c.row))
      },
      divided: true,
      icon: 'o',
    },
    // {
    //   label: 'ÏòÉÏÌí¼Ó',
    //   fn: (c: CurrentType, pageNum: number) => {
    //     current.value = null
    //     sort.value = c.index + 1 + (pageNum - 1) * 50
    //     dialogConfig.visible = true
    //     dialogConfig.title = 'Ìí¼Ó'
    //     dialogConfig.isAdd = false
    //   },
    //   divided: true,
    //   icon: 'up',
    // },
    // {
    //   label: 'ÏòÏÂÌí¼Ó',
    //   fn: (c: CurrentType, pageNum: number) => {
    //     current.value = null
    //     sort.value = c.index + 2 + (pageNum - 1) * 50
    //     dialogConfig.visible = true
    //     dialogConfig.title = 'Ìí¼Ó'
    //     dialogConfig.isAdd = false
    //   },
    //   divided: true,
    //   icon: 'down',
    // },
    // {
    //   label: '´´½¨¸±±¾',
    //   fn: async ({ row }: CurrentType) => {
    //     await $PageMenuInstanceName$.cloneData([row.id])
    //     ElMessage.success('´´½¨¸±±¾³É¹¦')
    //     tableRef.value?.getList()
    //   },
    //   divided: true,
    //   icon: 'copy',
    // },
    {
      label: 'ɾ³ý',
      fn: async (c: CurrentType) => {
        const names = selection.value.map((item: { $DeleteAlertAttr$: string }) => item.$DeleteAlertAttr$)
        ConfirmBox(
          `ÊÇ·ñɾ³ý${names.length ? names.join(',') : c.row.$DeleteAlertAttr$}`
        ).then(async () => {
          const ids = selection.value.map((item: { id: string }) => item.id)
          await $PageMenuInstanceName$.delete$EntityName$s(ids.length ? ids : [c.row.id])
          ElMessage.success('ɾ³ý³É¹¦')
          tableRef.value.getList()
        })
      },
      icon: 'close',
    },
  ]

  const onCheck = (records: any) => {
    selection.value = records
  }

  const onAdd$EntityName$ = () => {
    const params = tableRef.value?.getPaginationParams()
    current.value = null
    dialogConfig.visible = true
    dialogConfig.isAdd = true
    dialogConfig.title = 'Ìí¼Ó'
    sort.value = params.totalCount + 1
  }

  //µã»÷°´Å¥¡¾¸ß¼¶²éѯ¡¿
  const onAdvancedQuery = () => {
    const params = tableRef.value?.getPaginationParams()
    current.value = null
    dialogConfigForQuery.visible = true
    dialogConfigForQuery.isAdd = true
    dialogConfigForQuery.title = '¸ß¼¶²éѯ'
  }
 
  const onConfirm$EntityName$ = async () => {
    dialogConfig.visible = false
    if (dialogConfig.isAdd) {
      tableRef.value?.scrollToRow({
        skip: true,
      })
    } else {
      await tableRef.value?.getList()
    }
  }
  /**
   * Ðеã»÷ʱ¸üÐÂcurrent
   */
  const onRowClick = ({ row }: any) => {
    if (dialogConfig.visible && current.value) {
      current.value = row
    }
  }
  /**
   * µ¼³ö
   */
  const onExport = (data={}) => {
    //const params = tableRef.value?.getParams()
    exportFile('/api/v1/$NameSpacePath$/$PageMenuInstanceName$/export', data, '$PageMenuName$')
  }

  /**
   * ¹Ø¼ü×ÖËÑË÷
   */
  const onSearch = () => {
    tableRef.value?.getList({
      Filter: search.value,
    })
  }

  /**
   * ÖØÖñí¸ñÊý¾Ý
   */
  const reloadList = () => {
    tableRef.value?.getList()
  }
  /**
   * ÉÏ´«³É¹¦
   */
  const onSuccess = () => {
    tableRef.value?.getList()
    ElMessage.success('µ¼Èë³É¹¦')
  }
  /**
   * ʧ°Ü
   * @param err
   */
  const onError = (err: any) => {
    try {
      const message = JSON.parse(err.message)
      ElMessage.error(message.msg)
    } catch (error) {
      ElMessage.error('µ¼Èëʧ°Ü')
    }
  }
  /**
   * ÉÏ´«¹³×Ó
   */
  const onBeforeUpload = (file: File) => {
    const format = ['xlsx', 'xls', 'csv']
    if (!format.includes(file.name.split('.')[1])) {
      ElMessage.error('µ¼ÈëÎļþ¸ñʽ²»ÕýÈ·£¬Çëµ¼Èë.xlsx/.xlsÓë.csv¸ñʽµÄÎļþ')
      return false
    }
    return true
  }

  onMounted(() => {
    headers.value = {
      Authorization: `Bearer ${sessionStorage.getItem('Token')}`,
      'X-Project': sessionStorage.getItem('X-Project'),
    }
  })

  ctx.expose({
    reloadList,
  })

  return {
    dataSource,
    contextMenu,
    dialogConfig,
    dialogConfigForQuery,
    dialogSettingConfig,
    tableRef,
    current,
    search,
    sort,
    $PageMenuInstanceName$Columns,
    paginationParams,
    headers,
    onBeforeUpload,
    onError,
    onSuccess,
    openDetail,
    onSearch,
    onExport,
    onRowClick,
    onConfirm$EntityName$,
    onCheck,
    onAdd$EntityName$,
    onAdvancedQuery
  }
}