ideaz-element/es/element/table/src/hooks/useTableColumnSlots.mjs.map

<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>

{"version":3,"file":"useTableColumnSlots.mjs","sources":["../../../../../../packages/element/table/src/hooks/useTableColumnSlots.tsx"],"sourcesContent":["import { Operation, QuestionFilled } from '@element-plus/icons-vue'\nimport { getEventsFromCamel, isArray, isEmptyObject, isFunction, isObject, isSlot, isString } from '@ideaz/utils'\nimport { ElFormItem, ElIcon, ElTooltip } from 'element-plus'\nimport type { VNode } from 'vue'\nimport type { TableColumnProps } from '../props'\nimport TableButton from '../TableButton'\nimport { SELECT_TYPES } from '../../../form/src/hooks'\nimport TableCustomColumnContainer from '../TableCustomColumnContainer'\nimport type { TableColumnScopeData } from '../../../types'\n\nfunction getDynamicComponentName(type: string | (() => string)) {\n  const zNames = ['select', 'checkbox', 'radio', 'input']\n  const propComponentName = typeof type === 'function' ? type() : type\n\n  if (zNames.includes(propComponentName)) {\n    return `z-${propComponentName}`\n  }\n\n  else {\n    return propComponentName || 'unknown'\n  }\n}\n\nexport function useTableColumnSlots(props: TableColumnProps, slots: any, emit: any) {\n  const scopedSlots = shallowRef<any>({})\n  const ns = useNamespace('table-column')\n  const { t } = useLocale()\n\n  const getLabel = (row: any) => {\n    const { column = {} } = props\n    const options = props.tableProps.options\n    const prop = column.prop!\n    const type = isFunction(column.component) ? column.component() : isObject(column.component) ? column.component.name : column.component\n    if (type === 'radio' || (type === 'select' && !column.fieldProps?.multiple))\n      return options[prop] ? options[prop].find((item: { label: string, value: any }) => item.value === row?.[prop])?.label : ''\n\n    if ((type === 'select' && column.fieldProps?.multiple) || type === 'checkbox') {\n      const label: string[] = []\n      if (row[prop]) {\n        row[prop].forEach((item: any) => {\n          label.push(options[prop].find((option: { label: string, value: any }) => option.value === item)?.label)\n        })\n      }\n      return label.join(',')\n    }\n    if (type === 'el-switch')\n      return row[prop] ? (column.fieldProps?.activeText || 'true') : (column.fieldProps?.inactiveText || 'false')\n\n    return row[prop]\n  }\n\n  const getRules = () => {\n    const column = props.column\n    const label = props.column.label\n    const type = isFunction(column.component) ? column.component() : isObject(column.component) ? column.component.name : column.component\n    let message = ''\n    let rules = {}\n    if (SELECT_TYPES.includes((type || '').toLowerCase()))\n      message = label ? `${t('form.selectPlaceholder')}${label}` : `${t('form.selectPlaceholder')}`\n\n    else\n      message = label ? `${t('form.inputPlaceholder')}${label}` : `${t('form.inputPlaceholder')}`\n\n    if (column.required === true || column.rules?.required) {\n      rules = {\n        required: true,\n        message,\n        ...column.rules,\n      }\n    }\n    return isEmptyObject(rules) ? undefined : rules\n  }\n\n  watch(\n    () => props.column,\n    () => {\n      const { column = {}, size, tableProps } = props\n      const prop = column.prop || ''\n\n      if (\n        !['index', 'selection', 'radio', undefined].includes(column.type)\n        || column.slot\n        || column.render\n        || column.component\n      ) {\n        scopedSlots.value.default = (scope: TableColumnScopeData) => {\n          const renderCustomComponent = () => {\n            const events = getEventsFromCamel(column)\n            return (\n              <TableCustomColumnContainer\n                modelValue={scope.row[prop]}\n                onUpdate:modelValue={(val: any) => {\n                  const rowData = { ...scope.row, [prop]: val }\n                  const list = [...props.tableProps.data]\n                  list.splice(scope.$index, 1, rowData)\n                  emit('update:data', list)\n                }}\n                componentName={getDynamicComponentName(column.component!)}\n                evts={events}\n                size={size}\n                options={tableProps.options?.[prop] || []}\n                scope={scope}\n                column={column}\n                fieldProps={column.fieldProps}\n              />\n            )\n          }\n\n          if (column.type === 'expand' && isFunction(slots.expand))\n            return slots.expand(scope)\n\n          if (column.slot && slots[column.slot])\n            return slots[column.slot](scope)\n\n          if (column.type === 'sort' && isFunction(slots.sort))\n            return <div class={ns.b('draggable')}>{slots.sort(scope)}</div>\n\n          if (column.type === 'sort' && isFunction(column.render))\n            return <div class={ns.b('draggable')}>{column.render(scope)}</div>\n\n          if (isFunction(column.render))\n            return column.render(scope)\n\n          if (column.type === 'button' && isArray(column.buttons)) {\n            return (\n              <div class={ns.e('operation')}>\n                {column.buttons?.map((button) => {\n                  return <TableButton button={button} scope={scope} size={size} />\n                })}\n              </div>\n            )\n          }\n\n          if (column.type === 'sort')\n            return <div class={ns.b('draggable')}><ElIcon class={ns.be('draggable', 'handle')} size={24}><Operation /></ElIcon></div>\n\n          if (tableProps.editable) {\n            return scope.row.__isEdit === true\n              ? (\n                <ElFormItem prop={`tableData.${scope.$index}.${column.prop}`} rules={getRules()} class={[ns.b('form-item'), ns.bm('form-item', size)]}>\n                  {renderCustomComponent()}\n                </ElFormItem>\n                )\n              : <span>{getLabel(scope.row)}</span>\n          }\n\n          // warning\n          if ((column.slot && !slots[column.slot]) || (column.type === 'expand' && !isFunction(slots.expand)))\n            return null\n\n          return renderCustomComponent()\n        }\n      }\n\n      if (isSlot(column.label) && slots[column.label as string]) {\n        scopedSlots.value.header = (scope: TableColumnScopeData) =>\n          slots[column.label as string](scope)\n      }\n      if (isFunction(column.label))\n        scopedSlots.value.header = (scope: TableColumnScopeData) => (column.label as (scope: TableColumnScopeData) => VNode)(scope)\n\n      if (!isSlot(column.label) && !isFunction(column.label) && column.tooltip) {\n        const tooltip = column.tooltip\n        const tooltipProps = isObject(tooltip)\n          ? tooltip\n          : { content: isString(tooltip) ? tooltip : '' }\n        const tooltipSlot: any = {}\n\n        scopedSlots.value.header = (scope: TableColumnScopeData) => {\n          if (isFunction(tooltip))\n            tooltipSlot.content = () => tooltip(scope)\n          return (\n            <span>\n              {column.label}\n              <ElTooltip\n                effect=\"dark\"\n                placement=\"top\"\n                {...tooltipProps}\n                v-slots={tooltipSlot}\n              >\n                {tooltip && (\n                  <ElIcon class={ns.be('label', 'icon')}>\n                    <QuestionFilled />\n                  </ElIcon>\n                )}\n              </ElTooltip>\n            </span>\n          )\n        }\n      }\n    },\n    { immediate: true, deep: true },\n  )\n\n  return { scopedSlots }\n}\n"],"names":["_isSlot","s","isVNode","getDynamicComponentName","type","zNames","propComponentName","useTableColumnSlots","props","slots","emit","scopedSlots","shallowRef","ns","useNamespace","t","column","options","prop","isFunction","isObject","_a","_b","item","row","_c","label","rules","required","isEmptyObject","watch","tableProps","events","getEventsFromCamel","scope","val","rowData","size","createVNode","isArray","button","default","_slot","isSlot","tooltip","content","tooltipSlot","tooltipProps","immediate","deep"],"mappings":"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"}