import { ref } from 'vue'
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
|
export function useCrudPage({
|
createEmptyModel,
|
buildEditModel,
|
buildSavePayload,
|
saveRequest,
|
updateRequest,
|
deleteRequest,
|
entityName,
|
resolveRecordLabel,
|
refreshCreate,
|
refreshUpdate,
|
refreshRemove
|
}) {
|
const dialogVisible = ref(false)
|
const dialogType = ref('add')
|
const currentRecord = ref(createEmptyModel())
|
const selectedRows = ref([])
|
|
const resetCurrentRecord = () => {
|
currentRecord.value = createEmptyModel()
|
}
|
|
const handleSelectionChange = (rows) => {
|
selectedRows.value = Array.isArray(rows) ? rows : []
|
}
|
|
const showDialog = (type, record) => {
|
dialogType.value = type
|
currentRecord.value = type === 'edit' ? buildEditModel(record) : createEmptyModel()
|
dialogVisible.value = true
|
}
|
|
const closeDialog = () => {
|
dialogVisible.value = false
|
resetCurrentRecord()
|
}
|
|
const handleDialogSubmit = async (formData) => {
|
const payload = buildSavePayload(formData)
|
try {
|
if (dialogType.value === 'edit') {
|
await updateRequest(payload)
|
ElMessage.success('修改成功')
|
closeDialog()
|
await refreshUpdate?.()
|
return
|
}
|
|
await saveRequest(payload)
|
ElMessage.success('新增成功')
|
closeDialog()
|
await refreshCreate?.()
|
} catch (error) {
|
ElMessage.error(error?.message || '提交失败')
|
}
|
}
|
|
const handleDelete = async (record) => {
|
try {
|
const recordLabel = resolveRecordLabel?.(record) || record?.id
|
await ElMessageBox.confirm(`确定要删除${entityName}「${recordLabel}」吗？`, '删除确认', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
})
|
await deleteRequest(record.id)
|
ElMessage.success('删除成功')
|
await refreshRemove?.()
|
} catch (error) {
|
if (error !== 'cancel') {
|
ElMessage.error(error?.message || '删除失败')
|
}
|
}
|
}
|
|
const handleBatchDelete = async () => {
|
if (!selectedRows.value.length) return
|
const ids = selectedRows.value
|
.map((item) => item.id)
|
.filter((id) => id !== void 0 && id !== null)
|
if (!ids.length) return
|
|
try {
|
await ElMessageBox.confirm(`确定要批量删除选中的 ${ids.length} 个${entityName}吗？`, '批量删除确认', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
})
|
await deleteRequest(ids.join(','))
|
ElMessage.success('批量删除成功')
|
selectedRows.value = []
|
await refreshRemove?.()
|
} catch (error) {
|
if (error !== 'cancel') {
|
ElMessage.error(error?.message || '批量删除失败')
|
}
|
}
|
}
|
|
return {
|
dialogVisible,
|
dialogType,
|
currentRecord,
|
selectedRows,
|
handleSelectionChange,
|
showDialog,
|
closeDialog,
|
handleDialogSubmit,
|
handleDelete,
|
handleBatchDelete
|
}
|
}
|
