import {reactive, ref} from 'vue'

import {
    ObjectInterface,
    requestPayload,
    serverApi,
    deepAssign
} from '../script/index'


export class InitTable {
    parameter:ObjectInterface = reactive({
        name: {
            oper: 'LIKE',
            model: ''
        },
        parentId: {
            oper: 'EQUAL',
            model: ''
        }
    })
    sortObject:ObjectInterface = reactive({})

    loadingTable = reactive({
        isLoading: false
    })

    optionsTable = {
        i18n: false,
        tooltip: true,
        stripe: true,
        rowKey: 'id',
        mutiSelect: true,
        loading: this.loadingTable
    }

    treeKey = ''
    totalCount = ref(0)

    currentTree = reactive<ObjectInterface>({})
    selectData = reactive<string[]>([])
    treeData = reactive<ObjectInterface[]>([])
    list = reactive<ObjectInterface[]>([])
    selectRowData = reactive<ObjectInterface[]>([])

    constructor (public param: ObjectInterface) {
        Object.assign(this.parameter, this.param.parameter || {})
        Object.assign(this.optionsTable, this.param.optionsTable || {})
        Object.assign(this.sortObject, this.param.ordSort || {})
        this.treeKey = this.param.treeKey || 'parentId'
        // 根据 dialogConfig 属性来判断是否为弹框， 如果是弹窗默认不调用接口
        if (param.dialogConfig) {
            this.param.dialogConfig.loading = this.loadingTable
        } else {
            this.queryTreeData(this.param.treeParams)
            this.detailTable()
        }

    }

    handleSelectionChange = (list: []) => {
        this.selectRowData.length = 0
        // 进行深拷贝
        this.selectRowData.push(...JSON.parse(JSON.stringify(list)))
        this.selectData.length = 0
        this.selectData.push(...list.map((item: ObjectInterface) => {
            return item.id
        }))
    }

    addOrEditTable = () => {
        let api = this.param.modelData.id ? this.param.edit : this.param.add
        serverApi({
            params: this.param.modelData,
            tips: true,
            interface: api,
            loading: this.loadingTable,
            success: (resp) => {
                this.param.dialogConfig.isShowDialog = false
                this.param.confirm?.()
                this.param.emits('queryTableData', resp)
            }
        })
    }
    // 批量删除需要
    delTable = (ids?: string[]) => {
        serverApi({
            params: ids || this.selectData,
            tips: true,
            interface: this.param.del,
            loading: this.loadingTable,
            success: (data: any) => {
                this.queryTableData()
                this.param.delHandle?.()
            }
        })
    }

    queryTableData = () => {
        if (this.param.queryTableData) {
            this.param.queryTableData()
            return
        }
        if (!this.param.query) {
            return
        }
        serverApi({
            params: requestPayload(this.parameter, this.sortObject),
            interface: this.param.query,
            loading: this.loadingTable,
            success: (data: any) => {
                this.selectData.length = 0
                this.selectRowData.length = 0
                this.list.length = 0
                this.totalCount.value = data.totalCount
                this.list.push(...data.list)
                this.param.queryCallback?.(data)
            }
        })
    }

    detailTable = (id?: string) => {
        if ((!id && !this.param.modelData?.id) || !this.param.detail) {
            return
        }
        serverApi({
            params: id || this.param.modelData.id,
            interface: this.param.detail,
            loading: this.loadingTable,
            success: (data: any) => {
                this.param.detailHandle?.(data)
                deepAssign(this.param.modelData || {}, data)
            }
        })
    }

    queryTreeData = (params?: ObjectInterface) => {
        if (!this.param.tree) {
            // 没有树的时候 默认请求列表， 因为有树的时候会默认调用 handleTree， 这个里边默认会调用 queryTableData
            this.queryTableData()
            return
        }
        serverApi({
            interface: this.param.tree,
            params: params ? params : this.param.treeParams,
            loading: this.loadingTable,
            success: (data: any) => {
                this.treeData.length = 0
                this.treeData.push(...data)
            }
        })
    }

    // 操作行需要参数
    enableTable = (ids?: string[]) => {
        serverApi({
            params: {
                'enabled': 1,
                'ids': ids || this.selectData
            },
            loading: this.loadingTable,
            interface: this.param.enabled,
            success: () => {
                this.queryTableData()
            }
        })
    }

    disableTable = (ids?: string[]) => {
        serverApi({
            params: {
                'enabled': 0,
                'ids': ids || this.selectData
            },
            loading: this.loadingTable,
            interface: this.param.enabled,
            success: () => {
                this.queryTableData()
            }
        })
    }

    approval = (status: string, ids?: string[]) => {
        serverApi({
            params: {
                status,
                ids: ids || this.selectData
            },
            loading: this.loadingTable,
            tips: true,
            interface: this.param.approval,
            success: () => {
                this.queryTableData()
            }
        })
    }
    cancelApproval = (ids?: string[]) => {
        serverApi({
            params: ids || this.selectData,
            tips: true,
            loading: this.loadingTable,
            interface: this.param.cancelApproval,
            success: () => {
                this.queryTableData()
            }
        })
    }

    handleTree = (data: ObjectInterface) => {
        // 有回调函数，逻辑就在外边控制
        if (this.param.treeHandle) {
            this.param.treeHandle?.(data, this.parameter)
            return
        }
        this.parameter[this.treeKey] = data.id
        deepAssign(this.currentTree, JSON.parse(JSON.stringify(data)))
        this.queryTableData()
    }

    changeTableData = (data: ObjectInterface, isClick: boolean) => {
        isClick && this.queryTableData()
    }
    handleSortChange = (val) => {
        if (val.prop) {
            this.sortObject = {}
            this.sortObject[val.prop] = val.order === 'ascending' ? 'ASC' : 'DESC'
        }
        this.queryTableData()
    }
}