import { onMounted, ref, onBeforeUnmount, computed, reactive } from 'vue'

export function listPagination(SearchForm, api, delAxios = {}, type = {}, shut = 'shut') {
	if (shut == 'shut') {
		onMounted(() => {
			onSearch()
		})
	}

	const SearchFormDel = ref(SearchForm)
	const tableData = ref([])
	function onSearch(T) {
		api({ current: 1, size: 5, ...type, ...T }).then((reg) => {
			tableData.value = []
			tableData.value = reg.records || reg
			// Object.assign()
			// Object.assign()
			pagination.total = reg.total || 0
		})
	}

	const handlePageChange = (current, size) => {
		pagination.current = current
		pagination.pageSize = size
		onSearch({ current: pagination.current, size: pagination.pageSize, ...SearchFormDel.value })
	}
	const pagination = reactive({
		current: 1,
		pageSize: 5,
		total: 0,
		showSizeChanger: true,
		showQuickJumper: true,
		pageSizeOptions: ['5', '10', '30', '40'],
		showTotal: (total, range) => `共 ${total} 条`,
		onChange: handlePageChange
	})

	const Search = () => {
		pagination.current = 1
		pagination.pageSize = 5

		onSearch(SearchFormDel.value)
	}

	function onReset() {
		for (let key in SearchFormDel.value) {
			SearchFormDel.value[key] = ''
		}
		pagination.current = 1
		pagination.pageSize = 5
		onSearch()
	}
	const change = () => {
		pagination.current = 1
		pagination.pageSize = 5
		onSearch()
	}
	const DEl = async (v) => {
		const res = await delAxios([{ id: v.id }])
		onSearch({ current: pagination.current, size: pagination.pageSize })
	}

	return { DEl, change, tableData, onSearch, onReset, handlePageChange, pagination, Search, SearchFormDel }
}

//
export function listPaginationDEl(SearchForm, api, delAxios = {}, type = {}, shut = 'shut') {
	if (shut == 'shut') {
		onMounted(() => {
			onSearch()
		})
	}

	const SearchFormDel = ref(SearchForm)
	const tableData = ref([])
	function onSearch(T) {
		api({ current: 1, size: 5, ...type, ...T }).then((reg) => {
			tableData.value = []
			tableData.value = reg.records || res
			// Object.assign()
			// Object.assign()
			pagination.total = reg.total
		})
	}

	const handlePageChange = (current, size) => {
		pagination.current = current
		pagination.pageSize = size
		onSearch({ current: pagination.current, size: pagination.pageSize, ...SearchFormDel.value })
	}
	const pagination = reactive({
		current: 1,
		pageSize: 5,
		total: 0,
		showSizeChanger: true,
		showQuickJumper: true,
		pageSizeOptions: ['5', '10', '30', '40'],
		showTotal: (total, range) => `共 ${total} 条`,
		onChange: handlePageChange
	})

	const Search = () => {
		pagination.current = 1
		pagination.pageSize = 5

		onSearch(SearchFormDel.value)
	}

	function onReset() {
		for (let key in SearchFormDel.value) {
			SearchFormDel.value[key] = ''
		}
		pagination.current = 1
		pagination.pageSize = 5
		onSearch()
	}
	const change = () => {
		pagination.current = 1
		pagination.pageSize = 5
		onSearch()
	}
	const DEl = async (v) => {
		const res = await delAxios([{ id: v.id }])
		onSearch({ current: pagination.current, size: pagination.pageSize })
	}

	return { DEl, change, tableData, onSearch, onReset, handlePageChange, pagination, Search, SearchFormDel }
}

export function listPaginationBAQDE(onSearch = {}, SearchForm = {}) {
	const SearchFormDel = ref(SearchForm)
	const handlePageChange = (current, size) => {
		pagination.current = current
		pagination.pageSize = size
		onSearch({ current: pagination.current, size: pagination.pageSize, ...SearchFormDel.value })
	}
	const pagination = reactive({
		current: 1,
		pageSize: 5,
		total: 0,
		showSizeChanger: true,
		showQuickJumper: true,
		pageSizeOptions: ['5', '10', '30', '40'],
		showTotal: (total, range) => `共 ${total} 条`,
		onChange: handlePageChange
	})

	const Search = () => {
		pagination.current = 1
		pagination.pageSize = 5
		onSearch(SearchFormDel.value)
	}

	function onReset() {
		for (let key in SearchFormDel.value) {
			SearchFormDel.value[key] = ''
		}
		pagination.current = 1
		pagination.pageSize = 5
		onSearch()
	}
	return { onReset, handlePageChange, pagination, Search, SearchFormDel }
}
