cmc-web/packages/common/hooks/useTable.ts

103 lines
2.5 KiB
TypeScript

import { ref, toRefs, reactive } from 'vue'
import { MessageBox, Message } from 'element-ui'
import { handleSearchParam } from '@cmp/cmp-element'
interface IRemoveService {
(id: number, params?: any): Promise<Base.IResponseData>
}
interface IConfigs {
getService: {
(params: Base.IListParams): Promise<Base.IResponseList>
}
removeService?: IRemoveService
listFormat?: {
(data: any): any[]
}
afterGetList?: {
(): void
}
rows?: number
params?: any
initParams?: any
deleteTipKey?: string
}
interface IRecord {
id: number
name: string
}
export function useDelete(removeService: IRemoveService, getData: { (): void }, deleteTipKey = 'name') {
function handleDelete(record: any, params: any) {
MessageBox.confirm(`您确定要删除【${record[deleteTipKey]}】吗?`, '提示', {
confirmButtonClass: 'el-button--danger',
type: 'warning'
})
.then(async () => {
const res = await removeService(record.id, params)
if (res.success) {
Message.success(res.message)
getData()
}
})
.catch(e => {})
}
return {
handleDelete
}
}
export default function <T = any>(configs: IConfigs) {
const { getService, removeService, listFormat, rows = 10, params = {}, afterGetList, initParams, deleteTipKey = 'name' } = configs
const loading = ref(false)
const state: Base.IListState<T> = reactive({
list: [],
total: 0,
params: {
page: 1,
rows,
...params
}
})
// if (initParams) {
// state.params.params = handleSearchParam(initParams)
// }
async function getList() {
loading.value = true
try {
const data = await getService(state.params)
loading.value = false
if (data.success) {
if (listFormat) {
state.list = listFormat(data.data.rows)
} else {
state.list = data.data.rows
}
state.total = data.data.total
afterGetList && afterGetList()
}
} catch (e) {
loading.value = false
}
}
const { handleDelete } = useDelete(removeService as IRemoveService, getList, deleteTipKey)
return {
loading,
...toRefs(state),
getList,
handleDelete
}
}
export function useSelect() {
const selectList = ref<object[]>([])
function handleSelectItem(selection: object[], row: object) {
selectList.value = selection
}
function handleSelectAll(selection: object[]) {
selectList.value = selection
}
return {
selectList,
handleSelectItem,
handleSelectAll
}
}