ideaz-element

Version:

naivesteven.github.io/ideaz-element/

1 lines • 16.8 kB

Source Map (JSON)

View Raw

{"version":3,"file":"Crud.cjs","sources":["../../../../../packages/element/crud/src/Crud.tsx"],"sourcesContent":["import { ElAlert, ElButton, ElDrawer, ElWatermark, useAttrs } from 'element-plus'\nimport { omit } from 'lodash-unified'\nimport { Delete, Download, Plus } from '@element-plus/icons-vue'\nimport { isFunction, isObject, isString } from '@ideaz/utils'\nimport type { ComponentInternalInstance } from 'vue'\nimport { withKeys } from 'vue'\nimport { useFormMethods } from '../../form/src/hooks'\nimport {\n useTableMethods,\n} from '../../table/src/hooks'\nimport ZFilterForm from '../../form/src/FilterForm'\nimport ZDescription from '../../descriptions/src/index'\nimport ZDialog from '../../dialog/src/index'\nimport ZForm from '../../form/src/BaseForm'\nimport ZTable from '../../table/src/Table'\nimport type { Pagination } from '../../types'\nimport { useDataRequest, useDescriptions, useDialogConfig, useDrawerConfig, useFormColumns, useSelectionData } from './hooks'\nimport type { AlertConfig } from './props'\nimport { EXCLUDE_FORM_PROPS_KEYS, crudProps, crudProvideKey } from './props'\n\nexport default defineComponent({\n name: 'ZCrud',\n props: crudProps,\n emits: ['update:formData', 'update:pagination', 'search', 'reset', 'refresh', 'operate-submit', 'operate-delete', 'operate-view', 'operate-cancel', 'sort-change', 'update:data', 'update:editFormData', 'update:addFormData', 'update:selectionData', 'update:loading', 'selection-change', 'radio-change'],\n setup(props, { emit, slots, expose }) {\n const attrs = useAttrs()\n const {\n setCurrentRow,\n toggleRowSelection,\n clearSelection,\n clearFilter,\n toggleAllSelection,\n toggleRowExpansion,\n clearSort,\n toggleRadioSelection,\n sort,\n } = useTableMethods()\n const {\n resetFields,\n validate,\n validateField,\n clearValidate,\n scrollToField,\n } = useFormMethods()\n const {\n handleSearch,\n tableProps,\n handleReset,\n handleKeyDown,\n handlePaginationChange,\n handleSortChange,\n middleFormData,\n handleRadioChange,\n handleExport,\n getTableData,\n isShowDialog,\n rowData,\n currentMode,\n isShowDrawer,\n refreshAfterRequest,\n } = useDataRequest(props, emit)\n const { selectionData, isSelection, handleCheckboxChange, handleCloseAlert, handleMultipleDelete } = useSelectionData(props, emit, tableProps, refreshAfterRequest, getTableData)\n const { addFormColumns, editFormColumns, searchFormColumns, detailColumns } = useFormColumns(props)\n const {\n dialogProps,\n dialogFormData,\n dialogForm,\n isOperateFormLoading,\n handleCancel,\n handleConfirm,\n handleDialogClosed,\n handleDialogOpen,\n } = useDialogConfig(props, emit, currentMode, isShowDialog, rowData)\n const { drawerProps, isDescLoading, viewData, handleDrawerOpen } = useDrawerConfig(props)\n const { descriptionColumns, descriptionProps } = useDescriptions(props)\n const ns = useNamespace('crud')\n const { t } = useLocale()\n const size = useFormSize()\n\n provide(crudProvideKey, computed(() => {\n return {\n ...toRefs(props),\n size: tableProps.value.size,\n }\n }))\n\n provide(crudProvideKey, computed(() => {\n return {\n ...toRefs(props),\n size: tableProps.value.size,\n }\n }))\n\n expose({\n resetFields,\n validate,\n validateField,\n clearValidate,\n scrollToField,\n\n setCurrentRow,\n toggleRowSelection,\n clearSelection,\n clearFilter,\n toggleAllSelection,\n toggleRowExpansion,\n clearSort,\n toggleRadioSelection,\n sort,\n getTableData,\n })\n\n const { proxy: ctx } = getCurrentInstance() as ComponentInternalInstance\n\n const renderDecorator = (decoratorProps: any) => {\n const nativeTags = ['div', 'span', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6']\n const isNativeTag = nativeTags.includes(decoratorProps.name)\n const name = decoratorProps.name ? isNativeTag ? decoratorProps.name : resolveComponent(decoratorProps.name) : resolveComponent('el-card')\n return h(name, omit(decoratorProps, ['children', 'name']), isNativeTag ? decoratorProps.children() : decoratorProps.children)\n }\n\n const renderAlert = () => {\n const { alert } = props\n if (isFunction(alert))\n return alert(selectionData.value)\n if (isFunction(slots.alert))\n return slots.alert({ selectionData: selectionData.value })\n\n const alertProps = omit(props.alert, ['title', 'description']) as Omit<AlertConfig, 'title' | 'description'>\n return (\n <ElAlert\n type=\"success\"\n close-text={t('crud.unselect')}\n onClose={handleCloseAlert}\n class={ns.b('alert')}\n {...alertProps}\n v-slots={{\n title: isFunction(alert.title)\n ? () => (alert.title as Function)(selectionData.value, ctx!.$refs.zTableRef)\n : () => (alert.title || t('crud.selected') + selectionData.value.length + t('crud.term')),\n default: isFunction(alert.description) ? () => (alert.description as Function)(selectionData.value, ctx!.$refs.zTableRef) : () => (alert.description || ''),\n }}\n />\n )\n }\n\n const renderTable = () => {\n return renderDecorator({\n ...props.tableDecorator,\n class: ns.be('table', 'container'),\n children: () => {\n return (\n <ZTable\n ref=\"zTableRef\"\n {...{ size: size.value, ...tableProps.value }}\n v-slots={{\n ...slots,\n toolBarLeft: () => {\n return (\n <>\n {slots.toolBarLeft && slots.toolBarLeft()}\n {props.action && props.add && (\n <ElButton\n size={size.value}\n type=\"primary\"\n icon={Plus}\n onClick={() => {\n currentMode.value = 'add'\n isShowDialog.value = true\n }}\n >\n {t('crud.add')}\n </ElButton>\n )}\n {!!props.export && <ElButton size={size.value} type=\"primary\" icon={Download} class={ns.e('export')} onClick={handleExport}>{t('crud.export')}</ElButton>}\n {!!isSelection.value && props.delete && props.action && (\n <ElButton\n plain\n size={size.value}\n type=\"danger\"\n class={ns.e('multiple-delete')}\n icon={Delete}\n onClick={handleMultipleDelete}\n >\n {t('crud.multipleDelete')}\n </ElButton>\n )}\n </>\n )\n },\n toolBarBottom: () => {\n if (isSelection.value && props.action && props.alert)\n return renderAlert()\n\n return slots.toolBarBottom?.()\n },\n }}\n onUpdate:pagination={(pagination: Pagination) => emit('update:pagination', pagination)}\n onRefresh={handlePaginationChange}\n onSort-change={handleSortChange}\n onSelection-change={handleCheckboxChange}\n onRadio-change={handleRadioChange}\n >\n </ZTable>\n )\n },\n })\n }\n\n const renderSearchForm = () => {\n return searchFormColumns.value?.length > 0 && renderDecorator({\n ...props.formDecorator,\n style: {\n marginBottom: '16px',\n ...props.formDecorator?.style,\n },\n class: ns.be('filter-form', 'container'),\n children: () => (\n <>\n {isFunction(slots.formTop) ? slots.formTop() : null}\n <ZFilterForm\n ref=\"formRef\"\n {...{\n size: size.value,\n labelWidth: '60px',\n ...omit(props.search || {}, EXCLUDE_FORM_PROPS_KEYS),\n columns: searchFormColumns.value,\n ...attrs.value,\n searchButtonLoading: tableProps.value.loading,\n }}\n options={props.options}\n modelValue={middleFormData.value}\n onUpdate:modelValue={(val: any) => { middleFormData.value = val }}\n onSearch={handleSearch}\n onReset={handleReset}\n onKeydown={withKeys((e: KeyboardEvent) => handleKeyDown(e), ['enter'])}\n v-slots={slots}\n >\n </ZFilterForm>\n {isFunction(slots.formBottom) ? slots.formBottom() : null}\n </>\n ),\n })\n }\n\n const renderOperateForm = () => {\n const columns = currentMode.value === 'add' ? addFormColumns.value : currentMode.value === 'edit' ? editFormColumns.value : detailColumns.value\n // const formData = currentMode.value === 'add' ? props.addFormData : currentMode.value === 'edit' ? props.editFormData : rowData.value\n const formProps = omit(props.form || {}, EXCLUDE_FORM_PROPS_KEYS)\n const operateFormProps = currentMode.value === 'add' ? omit(props.add || {}, EXCLUDE_FORM_PROPS_KEYS) : omit(props.edit || {}, EXCLUDE_FORM_PROPS_KEYS)\n return (\n <ZForm\n {...{ size: size.value, labelWidth: '60px', ...formProps, ...operateFormProps }}\n ref={dialogForm}\n columns={columns}\n options={props.options}\n modelValue={dialogFormData.value}\n onUpdate:modelValue={(val: any) => { dialogFormData.value = val }}\n v-loading={isOperateFormLoading.value}\n v-slots={slots}\n >\n\n </ZForm>\n )\n }\n\n const renderDialog = () => {\n return (\n <ZDialog\n modelValue={isShowDialog.value}\n onUpdate:modelValue={(val: boolean) => isShowDialog.value = val}\n {...dialogProps.value}\n onOpen={handleDialogOpen}\n onClosed={handleDialogClosed}\n onConfirm={handleConfirm}\n onCancel={handleCancel}\n >\n {renderOperateForm()}\n </ZDialog>\n )\n }\n\n const renderDrawer = () => {\n return (\n <ElDrawer\n modelValue={isShowDrawer.value}\n onUpdate:modelValue={(val: boolean) => isShowDrawer.value = val}\n {...drawerProps.value}\n onOpen={() => handleDrawerOpen(rowData.value)}\n >\n <ZDescription v-loading={isDescLoading.value} columns={descriptionColumns.value} detail={viewData.value} {...{ size: size.value, ...descriptionProps.value }} />\n </ElDrawer>\n )\n }\n\n const renderMiddleContent = () => {\n return isFunction(slots.crudMiddle) ? slots.crudMiddle() : null\n }\n\n const renderCrudDecorator = () => {\n const content = () => (\n <>\n {renderSearchForm()}\n {renderMiddleContent()}\n {renderTable()}\n </>\n )\n if (isString(props.watermark)) {\n return (\n <ElWatermark content={props.watermark}>\n {content()}\n </ElWatermark>\n )\n }\n if (isObject(props.watermark)) {\n return (\n <ElWatermark {...{ ...props.watermark }}>\n {content()}\n </ElWatermark>\n )\n }\n return content()\n }\n\n return () => {\n // eslint-disable-next-line no-console\n console.log('刷新')\n return (\n <div ref=\"crudRef\" class={ns.b('')}>\n {renderCrudDecorator()}\n {renderDialog()}\n {renderDrawer()}\n </div>\n )\n }\n },\n})\n"],"names":["_isSlot","s","vue","Crud","name","props","emits","expose","attrs","elementPlus","sort","scrollToField","refreshAfterRequest","useDataRequest","props$1","emit","handleMultipleDelete","useSelectionData","tableProps","getTableData","detailColumns","useFormColumns","handleDialogOpen","useDialogConfig","currentMode","isShowDialog","rowData","handleDrawerOpen","useDrawerConfig","descriptionProps","useDescriptions","ns","useNamespace","t","size","useFormSize","provide","proxy","alert","alertProps","omit","handleCloseAlert","title","default","renderDecorator","Table","pagination","handlePaginationChange","handleSortChange","handleCheckboxChange","slots","_slot","_slot2","_slot3","iconsVue","isSelection","renderAlert","_a","style","marginBottom","labelWidth","searchButtonLoading","val","handleSearch","handleReset","is","formProps","operateFormProps","BaseForm","dialogForm","columns","isOperateFormLoading","_slot4","index","handleDialogClosed","handleConfirm","isShowDrawer","viewData","isDescLoading","content","renderSearchForm","renderMiddleContent","renderTable","_slot5","_slot6"],"mappings":"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"}