UNPKG

tdesign-mobile-vue

Version:
243 lines (237 loc) 9.74 kB
/** * tdesign v1.13.2 * (c) 2026 TDesign Group * @license MIT */ 'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var Vue = require('vue'); var tdesignIconsVueNext = require('tdesign-icons-vue-next'); var image_index = require('../image/index.js'); var imageViewer_index = require('../image-viewer/index.js'); var upload_props = require('./props.js'); var config = require('../config.js'); var upload_hooks_useUpload = require('./hooks/useUpload.js'); var hooks_tnode = require('../hooks/tnode.js'); var hooks_useClass = require('../hooks/useClass.js'); var configProvider_useConfig = require('../_chunks/dep-ede0b0a5.js'); var isBoolean = require('../_chunks/dep-f228bd6e.js'); require('../image/image.js'); require('@babel/runtime/helpers/slicedToArray'); require('@babel/runtime/helpers/defineProperty'); require('@vueuse/core'); require('../loading/index.js'); require('../loading/loading.js'); require('../loading/icon/gradient.js'); require('../_common/js/loading/circle-adapter.js'); require('../_common/js/utils/setStyle.js'); require('../_common/js/utils/helper.js'); require('@babel/runtime/helpers/toConsumableArray'); require('@babel/runtime/helpers/objectWithoutProperties'); require('../_chunks/dep-f8c1ee79.js'); require('../_chunks/dep-4e43cb11.js'); require('../_chunks/dep-db763263.js'); require('../_chunks/dep-d16bf091.js'); require('@babel/runtime/helpers/typeof'); require('../_chunks/dep-c6554877.js'); require('../_chunks/dep-a8725fec.js'); require('../_chunks/dep-dea6ba04.js'); require('../loading/icon/spinner.js'); require('../loading/props.js'); require('../shared/dom.js'); require('../_chunks/dep-abe9931d.js'); require('../_chunks/dep-c041cd95.js'); require('../loading/plugin.js'); require('../_chunks/dep-dafca6f5.js'); require('../_common/js/global-config/mobile/default-config.js'); require('../_common/js/global-config/mobile/locale/zh_CN.js'); require('../_chunks/dep-88b647f4.js'); require('../_chunks/dep-f339c931.js'); require('dayjs'); require('../_chunks/dep-89205991.js'); require('../_chunks/dep-082c7326.js'); require('../_chunks/dep-591548d1.js'); require('../_chunks/dep-a9fd9906.js'); require('../_chunks/dep-a837a88d.js'); require('../_chunks/dep-d2416277.js'); require('../_chunks/dep-4a0acbaa.js'); require('../_chunks/dep-f5894bc3.js'); require('../_chunks/dep-d404c733.js'); require('../_chunks/dep-bd009758.js'); require('../_chunks/dep-83213f5d.js'); require('../_chunks/dep-412d3c4b.js'); require('../_chunks/dep-644f5d6a.js'); require('../_chunks/dep-933759bc.js'); require('../hooks/render-tnode.js'); require('../_chunks/dep-88660f08.js'); require('../_chunks/dep-bcc78903.js'); require('../_chunks/dep-e1cc657b.js'); require('../_chunks/dep-a58ecafb.js'); require('../_chunks/dep-04cf2308.js'); require('../_chunks/dep-ea3a180f.js'); require('../_chunks/dep-016f6f84.js'); require('../_chunks/dep-671f1b66.js'); require('../_chunks/dep-a1831458.js'); require('../_common/js/utils/general.js'); require('../_chunks/dep-a625ee7d.js'); require('../_chunks/dep-e49294a5.js'); require('../shared/component.js'); require('../image/props.js'); require('../image-viewer/image-viewer.js'); require('../image-viewer/props.js'); require('../hooks/useDefaultValue.js'); require('../hooks/useGesture.js'); require('@use-gesture/vanilla'); require('../hooks/useVModel.js'); require('../swiper/index.js'); require('../swiper/swiper.js'); require('../swipe-cell/useSwipe.js'); require('../shared/util.js'); require('../swiper/props.js'); require('../swiper/swiper-item.js'); require('../_common/js/upload/main.js'); require('@babel/runtime/helpers/toArray'); require('../_common/js/upload/utils.js'); require('../_common/js/log/log.js'); require('../_common/js/upload/xhr.js'); var prefix = config["default"].prefix; var _Upload = Vue.defineComponent({ name: "".concat(prefix, "-upload"), components: { TImage: image_index.Image }, props: upload_props["default"], emits: ["update:files", "update:modelValue", "change", "fail", "preview", "progress", "remove", "success", "select-change", "validate", "click-upload"], setup: function setup(props, _ref) { var expose = _ref.expose; var uploadClass = hooks_useClass.usePrefixClass("upload"); var _useConfig = configProvider_useConfig.useConfig("upload"), globalConfig = _useConfig.globalConfig; var _useUpload = upload_hooks_useUpload["default"](props), disabled = _useUpload.disabled, displayFiles = _useUpload.displayFiles, uploading = _useUpload.uploading, inputRef = _useUpload.inputRef, uploadFilePercent = _useUpload.uploadFilePercent, uploadFiles = _useUpload.uploadFiles, onNormalFileChange = _useUpload.onNormalFileChange, onInnerRemove = _useUpload.onInnerRemove, cancelUpload = _useUpload.cancelUpload; var renderTNodeJSX = hooks_tnode.useTNodeJSX(); var showViewer = Vue.ref(false); var initialIndex = Vue.ref(0); var handlePreview = function handlePreview(e, file, index) { var _props$onPreview; initialIndex.value = index; showViewer.value = props.preview; (_props$onPreview = props.onPreview) === null || _props$onPreview === void 0 || _props$onPreview.call(props, { e: e, file: file, index: index }); }; var triggerUpload = function triggerUpload(e) { var _props$onClickUpload; var input = inputRef.value; if (disabled !== null && disabled !== void 0 && disabled.value) return; input.click(); (_props$onClickUpload = props.onClickUpload) === null || _props$onClickUpload === void 0 || _props$onClickUpload.call(props, { e: e }); }; var previewImgs = Vue.computed(function () { return displayFiles.value.map(function (item) { return item.url; }); }); var handleImageClose = function handleImageClose(_ref2) { var visible = _ref2.visible; showViewer.value = visible; }; var renderStatus = function renderStatus(file) { if (file.status === "fail" || file.status === "progress") { return Vue.createVNode("div", { "class": "".concat(uploadClass.value, "__progress-mask") }, [file.status === "progress" ? Vue.createVNode(Vue.Fragment, null, [Vue.createVNode(tdesignIconsVueNext.LoadingIcon, { "class": "".concat(uploadClass.value, "__progress-loading"), "size": "24" }, null), Vue.createVNode("div", { "class": "".concat(uploadClass.value, "__progress-text") }, [file.percent ? "".concat(file.percent, "%") : globalConfig.value.progress.uploadingText])]) : Vue.createVNode(tdesignIconsVueNext.CloseCircleIcon, { "size": "24" }, null), file.status === "fail" && Vue.createVNode("div", { "class": "".concat(uploadClass.value, "__progress-text") }, [globalConfig.value.progress.failText])]); } }; var renderAddContent = function renderAddContent() { var _displayFiles$value; if (!props.addBtn) return null; if (props.max === 0 || props.max > 0 && ((_displayFiles$value = displayFiles.value) === null || _displayFiles$value === void 0 ? void 0 : _displayFiles$value.length) < props.max) { var addBtnNode = renderTNodeJSX("addBtn", Vue.createVNode(tdesignIconsVueNext.AddIcon, null, null)); var addContentNode = renderTNodeJSX("addContent"); return Vue.createVNode("div", { "class": "".concat(uploadClass.value, "__item ").concat(uploadClass.value, "__item--add"), "onClick": triggerUpload }, [Vue.createVNode("div", { "class": "".concat(uploadClass.value, "__add-icon") }, [addContentNode || addBtnNode])]); } return null; }; expose({ upload: inputRef.value, uploading: uploading, triggerUpload: triggerUpload, uploadFiles: uploadFiles, cancelUpload: cancelUpload, uploadFilePercent: uploadFilePercent }); return function () { return Vue.createVNode("div", { "class": "".concat(uploadClass.value) }, [displayFiles.value.map(function (file, index) { return Vue.createVNode("div", { "key": index, "class": "".concat(uploadClass.value, "__item") }, [file.url && Vue.createVNode(Vue.resolveComponent("t-image"), Vue.mergeProps({ "class": "".concat(uploadClass.value, "__image"), "shape": "round" }, props.imageProps, { "src": file.url, "onClick": function onClick(e) { return handlePreview(e, file, index); } }), null), renderStatus(file), (isBoolean.isBoolean(file.removeBtn) ? file.removeBtn : props.removeBtn) && Vue.createVNode(tdesignIconsVueNext.CloseIcon, { "class": "".concat(uploadClass.value, "__delete-btn"), "onClick": function onClick(_ref3) { var e = _ref3.e; return onInnerRemove({ e: e, file: file, index: index }); } }, null)]); }), renderAddContent(), Vue.createVNode("input", Vue.mergeProps({ "ref": inputRef, "value": props.files, "type": "file", "multiple": props.multiple, "hidden": true }, props.capture ? { capture: props.capture } : {}, { "accept": props.accept, "onChange": onNormalFileChange }), null), Vue.createVNode(imageViewer_index.ImageViewer, { "visible": showViewer.value, "images": previewImgs.value, "index": initialIndex.value, "onClose": handleImageClose }, null)]); }; } }); exports["default"] = _Upload; //# sourceMappingURL=upload.js.map