UNPKG

ideaz-element

Version:

<p align="center"> <a href="" target="_blank" rel="noopener noreferrer"> <img src="./docs/public/logo.svg" alt="Ideaz Element" width="180" style="width: 180px;" /> </a> </p>

1 lines 10.2 kB
{"version":3,"file":"useEditableColumns.mjs","sources":["../../../../../../packages/element/table/src/hooks/useEditableColumns.ts"],"sourcesContent":["import { isFunction, isObject, uid } from '@ideaz/utils'\nimport { isEqual } from 'lodash-unified'\nimport type { Ref } from 'vue'\nimport DialogTip from '../../../dialog/src/dialog'\nimport type { ITableProps } from '../props'\nimport type { BtnItem, TableCol, TableColumnScopeData } from '../../../types'\n\nfunction replacePropertyValues(obj: any, reverse = false) {\n for (const key in obj) {\n if (key.endsWith('Prop')) {\n const valueKey = key.slice(0, -4)\n if (Object.hasOwnProperty.call(obj, valueKey)) {\n if (reverse)\n obj[valueKey] = obj[key]\n\n else\n obj[key] = obj[valueKey]\n }\n }\n }\n\n return obj\n}\n\nexport function useEditableColumns(props: ITableProps, emit: any, tableData: Ref<any>): { zTableFormRef: Ref<any>, columns: Ref<TableCol[]> } {\n const editableType = ref<'single' | 'multiple'>(isObject(props.editable) ? (props.editable.type || 'single') : 'single')\n const zTableFormRef = ref()\n const columns = ref<TableCol[]>([])\n const { t } = useLocale()\n const { editable } = props\n\n const generateValidateFields = (index: number) => {\n if (tableData.value.length)\n return Object.keys(tableData.value[0]).map(prop => `tableData.${index}.${prop}`)\n\n return []\n }\n\n const renderEdit = (): BtnItem => {\n return {\n label: t('common.edit'),\n type: 'primary',\n link: true,\n hide: ({ row }: TableColumnScopeData) => row.__isEdit || editableType.value === 'multiple',\n onClick: ({ row, $index, column }: TableColumnScopeData) => {\n if (isObject(props.editable) && isFunction(props.editable?.onEdit)) {\n props.editable?.onEdit({ row, $index, column, formRef: zTableFormRef.value })\n }\n else {\n row.__isEdit = true\n emit('update:data', tableData.value)\n }\n },\n }\n }\n\n const renderSave = (): BtnItem => {\n return {\n label: t('common.save'),\n type: 'primary',\n link: true,\n hide: ({ row }: TableColumnScopeData) => !row.__isEdit || editableType.value === 'multiple',\n onClick: ({ row, $index, column }: TableColumnScopeData) => {\n if (!zTableFormRef.value)\n return\n if (isObject(props.editable) && isFunction(props.editable?.onSave)) {\n props.editable?.onSave({ row, $index, column, formRef: zTableFormRef.value })\n }\n else {\n zTableFormRef.value.validateField\n && zTableFormRef.value.validateField(generateValidateFields($index), (validated: boolean) => {\n if (!validated)\n return\n\n replacePropertyValues(row)\n row.__isEdit = false\n emit('update:data', tableData.value)\n })\n }\n },\n }\n }\n\n const renderCancel = (): BtnItem => {\n return {\n label: t('common.cancel'),\n type: 'primary',\n link: true,\n hide: ({ row }: TableColumnScopeData) => !row.__isEdit || editableType.value === 'multiple',\n onClick: ({ row, $index, column }: TableColumnScopeData) => {\n if (isObject(props.editable) && isFunction(props.editable?.onCancel)) {\n props.editable?.onCancel({ row, $index, column, formRef: zTableFormRef.value })\n }\n else {\n replacePropertyValues(row, true)\n row.__isEdit = false\n emit('update:data', tableData.value)\n }\n },\n }\n }\n\n const renderDelete = (): BtnItem => {\n return {\n label: t('common.delete'),\n type: 'primary',\n link: true,\n onClick: ({ row, $index, column }: TableColumnScopeData) => {\n const delData = () => {\n if (isObject(props.editable) && isFunction(props.editable?.onDelete)) {\n props.editable?.onDelete({ row, $index, column, formRef: zTableFormRef.value })\n }\n else {\n tableData.value.splice($index, 1)\n emit('update:data', tableData.value)\n }\n }\n if (isObject(props.editable) && props.editable?.deleteConfirm) {\n DialogTip({\n type: 'warning',\n title: t('dialog.tip'),\n message: t('table.deleteTip'),\n onConfirm: ({ done }) => {\n done()\n delData()\n },\n })\n }\n else {\n delData()\n }\n },\n }\n }\n\n watch(() => props.columns, (newVal, oldVal) => {\n // Avoid excessive update problems caused by reference address changes\n if (isEqual(newVal, oldVal))\n return\n const cols = props.columns.map((item: TableCol) => {\n if (item.type === 'sort')\n return { width: 48, ...item, __uid: uid() }\n if (isObject(item.component))\n return { ...item, __uid: uid(), component: markRaw(item.component) }\n return { ...item, __uid: uid() }\n }) as TableCol[]\n if (editable && cols.length > 0 && cols[cols.length - 1]?.type !== 'button') {\n columns.value = cols.concat({\n type: 'button',\n __uid: uid(),\n label: t('table.action'),\n buttons: [\n renderEdit(),\n renderSave(),\n renderCancel(),\n renderDelete(),\n ],\n } as TableCol)\n }\n else if (editable && cols.length > 0 && cols[cols.length - 1]?.type === 'button') {\n columns.value = cols.map((item: TableCol) => {\n if (item.type === 'button') {\n if (isFunction(item.buttons))\n item.buttons = item.buttons({ renderEdit: renderEdit(), renderSave: renderSave(), renderCancel: renderCancel(), renderDelete: renderDelete() }, tableData)\n }\n return item\n })\n }\n else {\n columns.value = cols\n }\n }, { immediate: true, deep: true })\n\n return { columns, zTableFormRef }\n}\n"],"names":["replacePropertyValues","obj","reverse","key","valueKey","useEditableColumns","props","emit","tableData","editableType","ref","isObject","zTableFormRef","columns","t","useLocale","editable","generateValidateFields","index","prop","renderEdit","row","$index","column","isFunction","_a","_b","renderSave","validated","renderCancel","renderDelete","delData","DialogTip","done","watch","newVal","oldVal","isEqual","cols","item","uid","markRaw"],"mappings":"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"}