xdesign-vue-next/es/transfer/transfer.mjs.map

XDesign Component for vue-next

{"version":3,"file":"transfer.mjs","sources":["../../src/transfer/transfer.tsx"],"sourcesContent":["import { defineComponent, computed, toRefs } from 'vue';\nimport pick from 'lodash/pick';\nimport TransferList from './components/transfer-list';\nimport TransferOperations from './components/transfer-operations';\nimport { TransferListType, CheckedOptions, TransferValue, EmptyType, TargetParams, SearchEvent } from './interface';\n\nimport { getTransferListOption, getDataValues, getTransferData, filterTransferData, TRANSFER_NAME } from './utils';\nimport { PageInfo, TdPaginationProps } from '../pagination/type';\nimport props from './props';\nimport { TNode } from '../common';\nimport useVModel from '../hooks/useVModel';\nimport useDefaultValue from '../hooks/useDefaultValue';\n\n// hooks\nimport { useFormDisabled } from '../form/hooks';\nimport { usePrefixClass } from '../hooks/useConfig';\nimport isFunction from 'lodash/isFunction';\n\nconst SOURCE = 'source';\nconst TARGET = 'target';\n\nexport default defineComponent({\n  name: TRANSFER_NAME,\n  props: { ...props },\n\n  setup(props, { slots }) {\n    const disabled = useFormDisabled();\n    const classPrefix = usePrefixClass();\n    const { value, modelValue, checked } = toRefs(props);\n    const [innerValue, setInnerValue] = useVModel(value, modelValue, props.defaultValue, props.onChange);\n    // @ts-ignore TODO\n    const [innerChecked] = useDefaultValue(checked, props.defaultChecked, props.onCheckedChange, 'checked');\n    const valueList = computed(() => innerValue.value);\n\n    const isTreeMode = computed(() => {\n      const treeSlot = slots.tree;\n      return isFunction(treeSlot);\n    });\n\n    const leftButtonDisabled = computed(() => props.direction === 'right');\n    const rightButtonDisabled = computed(() => props.direction === 'left');\n    // props 传入的 data 格式化后的数据\n    const transferData = computed(() => {\n      return getTransferData(props.data, props.keys, isTreeMode.value);\n    });\n    const sourceList = computed(() => {\n      return filterTransferData(transferData.value, valueList.value as TransferValue[], false, isTreeMode.value);\n    });\n    const targetList = computed(() => {\n      return filterTransferData(transferData.value, valueList.value as TransferValue[], true, isTreeMode.value);\n    });\n    // 被选中的value\n    const checkedValue = computed(() => {\n      return {\n        [SOURCE]: getDataValues(sourceList.value, innerChecked.value, { isTreeMode: isTreeMode.value }),\n        [TARGET]: getDataValues(targetList.value, innerChecked.value, { isTreeMode: isTreeMode.value }),\n      };\n    });\n    const hasFooter = computed(() => {\n      return !!slots.footer || !!props.footer;\n    });\n    const showPagination = computed(() => {\n      // 翻页在自定义列表无效\n      return !!props.pagination && !slots.content;\n    });\n    const showSearch = computed(() => {\n      // 翻页在自定义列表无效\n      return !!props.search;\n    });\n    const footerOption = computed(() => {\n      const footer = props.footer || '';\n      return getTransferListOption<string | Function>(footer);\n    });\n    const emptyOption = computed(() => {\n      return getTransferListOption<EmptyType>(props.empty);\n    });\n    const searchOption = computed(() => {\n      return getTransferListOption<boolean>(props.search);\n    });\n    const checkAllOption = computed(() => {\n      return getTransferListOption<boolean>(props.showCheckAll);\n    });\n    const disabledOption = computed(() => {\n      return getTransferListOption<boolean>(disabled.value);\n    });\n    const titleOption = computed(() => {\n      return getTransferListOption<string | TNode<{ type: TransferListType }>>(props.title);\n    });\n    const paginationOption = computed(() => {\n      return getTransferListOption<TdPaginationProps>(props.pagination);\n    });\n\n    const handleCheckedChange = (val: Array<TransferValue>, listType: TransferListType) => {\n      const sourceChecked = listType === SOURCE ? val : checkedValue.value[SOURCE];\n      const targetChecked = listType === TARGET ? val : checkedValue.value[TARGET];\n      const checked = [...sourceChecked, ...targetChecked];\n      const event: CheckedOptions = {\n        checked,\n        sourceChecked,\n        targetChecked,\n        type: listType,\n      };\n      // TODO onCheckedChange 参数有点不合理\n      innerChecked.value = checked;\n      props.onCheckedChange?.(event);\n    };\n\n    const transferTo = (toDirection: TransferListType) => {\n      const oldTargetValue: Array<TransferValue> = JSON.parse(JSON.stringify(valueList.value));\n      let newTargetValue: Array<TransferValue>;\n      const selfCheckedValue = toDirection === TARGET ? checkedValue.value[SOURCE] : checkedValue.value[TARGET];\n      // target->source\n      if (toDirection === SOURCE) {\n        newTargetValue = oldTargetValue.filter((v) => !selfCheckedValue.includes(v));\n      } else if (props.targetSort === 'original') {\n        // 按照原始顺序\n        newTargetValue = getDataValues(transferData.value, oldTargetValue.concat(selfCheckedValue), {\n          isTreeMode: isTreeMode.value,\n        });\n      } else if (props.targetSort === 'unshift') {\n        newTargetValue = selfCheckedValue.concat(oldTargetValue);\n      } else {\n        newTargetValue = oldTargetValue.concat(selfCheckedValue);\n      }\n\n      // 清空checked。与toDirection相反\n      handleCheckedChange([], toDirection === SOURCE ? TARGET : SOURCE);\n\n      const params: TargetParams = {\n        type: toDirection,\n        movedValue: selfCheckedValue,\n      };\n      setInnerValue(newTargetValue, params);\n    };\n\n    // 点击移到右边按钮触发的函数\n    const transferToRight = () => {\n      transferTo(TARGET);\n    };\n    // 点击移到左边按钮触发的函数\n    const transferToLeft = () => {\n      transferTo(SOURCE);\n    };\n\n    const handleScroll = (e: Event, listType: TransferListType) => {\n      const target = e.target as HTMLElement;\n      const bottomDistance = target.scrollHeight - target.scrollTop - target.clientHeight;\n      const event: { e: Event; bottomDistance: number; type: TransferListType } = {\n        e,\n        bottomDistance,\n        type: listType,\n      };\n      props.onScroll?.(event);\n    };\n    const handleSearch = (e: SearchEvent) => {\n      props.onSearch?.(e);\n    };\n    const handlePageChange = (pageInfo: PageInfo, listType: TransferListType) => {\n      props.onPageChange?.(pageInfo, { type: listType });\n    };\n    const renderTransferList = (listType: TransferListType) => {\n      const scopedSlots = pick(slots, ['title', 'empty', 'footer', 'operation', 'transferItem', 'default', 'tree']);\n      return (\n        <TransferList\n          checkboxProps={props.checkboxProps}\n          transferItem={props.transferItem}\n          list-type={listType}\n          title={titleOption.value[listType]}\n          data-source={listType === SOURCE ? sourceList.value : targetList.value}\n          checked-value={checkedValue.value[listType]}\n          disabled={disabledOption.value[listType]}\n          search={searchOption.value[listType]}\n          pagination={paginationOption.value[listType]}\n          check-all={checkAllOption.value[listType]}\n          footer={footerOption.value[listType]}\n          empty={emptyOption.value[listType]}\n          onCheckedChange={($event: any) => handleCheckedChange($event, listType)}\n          onScroll={($event: any) => handleScroll($event, listType)}\n          onSearch={handleSearch}\n          onPageChange={($event: any) => handlePageChange($event, listType)}\n          isTreeMode={isTreeMode.value}\n        >\n          {scopedSlots}\n        </TransferList>\n      );\n    };\n\n    return () => (\n      <div\n        class={[\n          `${classPrefix.value}-transfer`,\n          showSearch.value ? `${classPrefix.value}-transfer__search` : '',\n          hasFooter.value ? `${classPrefix.value}-transfer__footer` : '',\n          showPagination.value ? `${classPrefix.value}-transfer__pagination` : '',\n          isTreeMode.value ? `${classPrefix.value}-transfer--with-tree` : '',\n        ]}\n      >\n        {renderTransferList(SOURCE)}\n        <TransferOperations\n          leftDisabled={\n            disabledOption.value[TARGET] || leftButtonDisabled.value || checkedValue.value[TARGET].length === 0\n          }\n          rightDisabled={\n            disabledOption.value[SOURCE] || rightButtonDisabled.value || checkedValue.value[SOURCE].length === 0\n          }\n          operation={props.operation}\n          onMoveToRight={transferToRight}\n          onMoveToLeft={transferToLeft}\n          v-slots={{ operation: slots.operation }}\n        />\n        {renderTransferList(TARGET)}\n      </div>\n    );\n  },\n});\n"],"names":["_isVNode","name","props","setup","innerValue","setInnerValue","innerChecked","checked","sourceChecked","targetChecked","type","newTargetValue","movedValue","e","bottomDistance","_createVNode"],"mappings":"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"}