xdesign-vue-next/es/upload/themes/dragger-file.mjs.map

XDesign Component for vue-next

{"version":3,"file":"dragger-file.mjs","sources":["../../../src/upload/themes/dragger-file.tsx"],"sourcesContent":["import { defineComponent, toRefs, PropType, ref, computed, h } from 'vue';\nimport { abridgeName, getFileSizeText } from '../../_common/js/upload/utils';\nimport { TdUploadProps, UploadFile } from '../type';\nimport Button from '../../button';\nimport { CommonDisplayFileProps } from '../interface';\nimport { commonProps } from '../constants';\nimport useCommonClassName from '../../hooks/useCommonClassName';\nimport TLoading from '../../loading';\nimport useDrag, { UploadDragEvents } from '../hooks/useDrag';\nimport ImageViewer from '../../image-viewer';\nimport { useTNodeJSX } from '../../hooks';\nimport { UploadConfig } from '../../config-provider';\nimport Image from '../../image';\n\nexport interface DraggerProps extends CommonDisplayFileProps {\n  trigger?: TdUploadProps['trigger'];\n  triggerUpload?: (e: MouseEvent) => void;\n  uploadFiles?: (toFiles?: UploadFile[]) => void;\n  cancelUpload?: (context: { e: MouseEvent; file: UploadFile }) => void;\n  dragEvents: UploadDragEvents;\n}\n\nexport default defineComponent({\n  name: 'UploadDraggerFile',\n\n  props: {\n    ...commonProps,\n    trigger: Function as PropType<DraggerProps['trigger']>,\n    triggerUpload: Function as PropType<DraggerProps['triggerUpload']>,\n    uploadFiles: Function as PropType<DraggerProps['uploadFiles']>,\n    cancelUpload: Function as PropType<DraggerProps['cancelUpload']>,\n    dragEvents: Object as PropType<DraggerProps['dragEvents']>,\n  },\n\n  setup(props, { slots }) {\n    const { displayFiles, disabled, accept } = toRefs(props);\n    const locale = computed(() => props.locale as UploadConfig);\n\n    const renderTNodeJSX = useTNodeJSX();\n\n    const { sizeClassNames } = useCommonClassName();\n    const uploadPrefix = `${props.classPrefix}-upload`;\n\n    const drag = useDrag(props.dragEvents, accept);\n    const { dragActive } = drag;\n\n    const draggerFileRef = ref();\n\n    const classes = computed(() => [\n      `${uploadPrefix}__dragger`,\n      { [`${uploadPrefix}__dragger-center`]: !displayFiles.value[0] },\n      { [`${uploadPrefix}__dragger-error`]: displayFiles.value[0]?.status === 'fail' },\n    ]);\n\n    const renderImage = () => {\n      if (!props.displayFiles.length) return;\n      const file = displayFiles.value[0];\n      if (!file) return null;\n      const url = file?.url || file?.response?.url;\n      return (\n        <div class={`${uploadPrefix}__dragger-img-wrap`}>\n          <ImageViewer\n            images={[url]}\n            trigger={(h, { open }: any) => <Image src={url || file.raw} onClick={open} error=\"\" />}\n          ></ImageViewer>\n        </div>\n      );\n    };\n\n    const renderUploading = () => {\n      if (!props.displayFiles.length) return;\n      const file = displayFiles.value[0];\n      if (!file) return null;\n      if (file?.status === 'progress') {\n        return (\n          <div class={`${uploadPrefix}__single-progress`}>\n            <TLoading />\n            {props.showUploadProgress && <span class={`${uploadPrefix}__single-percent`}>{file.percent}%</span>}\n          </div>\n        );\n      }\n    };\n\n    const renderMainPreview = () => {\n      const file = displayFiles.value[0];\n      const fileName = props.abridgeName ? abridgeName(file.name, ...props.abridgeName) : file.name;\n\n      const fileInfo = [\n        <div class={`${uploadPrefix}__dragger-text`} key=\"info\">\n          <span class={`${uploadPrefix}__single-name`}>{fileName}</span>\n          {file.status === 'progress' && renderUploading()}\n          {file.status === 'success' && <icon-ri-checkbox-circle-fill />}\n          {file.status === 'fail' && <icon-ri-error-warning-fill />}\n        </div>,\n        <small class={`${sizeClassNames.small}`} key=\"size\">\n          {locale.value.file.fileSizeText}：{getFileSizeText(file.size)}\n        </small>,\n        <small class={`${sizeClassNames.small}`} key=\"time\">\n          {locale.value.file.fileOperationDateText}：{file.uploadTime || '-'}\n        </small>,\n      ];\n      return (\n        <div class={`${uploadPrefix}__dragger-progress`}>\n          {props.theme === 'image' && renderImage()}\n          <div class={`${uploadPrefix}__dragger-progress-info`}>\n            {renderTNodeJSX('fileListDisplay', { params: { files: props.displayFiles } }) || fileInfo}\n\n            <div class={`${uploadPrefix}__dragger-btns`}>\n              {['progress', 'waiting'].includes(file.status) && !disabled.value && (\n                <Button\n                  theme=\"primary\"\n                  variant=\"text\"\n                  class={`${uploadPrefix}__dragger-progress-cancel`}\n                  onClick={(e: MouseEvent) =>\n                    props.cancelUpload?.({\n                      e,\n                      file: props.toUploadFiles[0] || props.files[0],\n                    })\n                  }\n                >\n                  {locale.value?.cancelUploadText}\n                </Button>\n              )}\n              {!props.autoUpload && file.status === 'waiting' && (\n                <Button\n                  theme=\"primary\"\n                  variant=\"text\"\n                  disabled={disabled.value}\n                  onClick={() => props.uploadFiles?.()}\n                  class={`${uploadPrefix}__dragger-upload-btn`}\n                >\n                  {locale.value.triggerUploadText.normal}\n                </Button>\n              )}\n            </div>\n            {['fail', 'success'].includes(file?.status) && !disabled.value && (\n              <div class={`${uploadPrefix}__dragger-btns`}>\n                <Button\n                  theme=\"primary\"\n                  variant=\"text\"\n                  disabled={disabled.value}\n                  class={`${uploadPrefix}__dragger-progress-cancel`}\n                  onClick={props.triggerUpload}\n                >\n                  {locale.value.triggerUploadText.reupload}\n                </Button>\n                <Button\n                  theme=\"danger\"\n                  variant=\"text\"\n                  disabled={disabled.value}\n                  class={`${uploadPrefix}__dragger-delete-btn`}\n                  onClick={(e: MouseEvent) => props.onRemove({ e, index: 0, file })}\n                >\n                  {locale.value.triggerUploadText.delete}\n                </Button>\n              </div>\n            )}\n          </div>\n        </div>\n      );\n    };\n\n    const renderDefaultDragElement = () => {\n      const unActiveElement = (\n        <div>\n          <span class={`${uploadPrefix}--highlight`}>{locale.value.triggerUploadText?.normal}</span>\n          <span>&nbsp;&nbsp;/&nbsp;&nbsp;{locale.value.dragger.draggingText}</span>\n        </div>\n      );\n      const activeElement = <div>{locale.value.dragger.dragDropText}</div>;\n      return dragActive.value ? activeElement : unActiveElement;\n    };\n\n    const getContent = () => {\n      const file = displayFiles.value[0];\n      if (file && (['progress', 'success', 'fail', 'waiting'].includes(file.status) || !file.status)) {\n        return renderMainPreview();\n      }\n      return (\n        <div class={`${uploadPrefix}__trigger`} onClick={props.triggerUpload}>\n          {slots.default?.() || renderDefaultDragElement()}\n        </div>\n      );\n    };\n\n    return () => (\n      <div\n        ref={draggerFileRef}\n        class={classes.value}\n        onDrop={drag.handleDrop}\n        onDragenter={drag.handleDragenter}\n        onDragover={drag.handleDragover}\n        onDragleave={drag.handleDragleave}\n      >\n        {props.trigger?.(h, { files: displayFiles.value, dragActive: dragActive.value }) || getContent()}\n      </div>\n    );\n  },\n});\n"],"names":["name","props","trigger","triggerUpload","uploadFiles","cancelUpload","dragEvents","setup","_createVNode","h","_resolveComponent","params","e","file","index"],"mappings":"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"}