yc-design-vue 2.0.6 → 2.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.umd.js +1 -1
- package/dist/style.css +1 -1
- package/es/Input/InputSuffix.vue.js +1 -1
- package/es/Progress/ProgressCircle.vue.js +1 -1
- package/es/Transfer/TransferPanel.vue.js +1 -1
- package/es/Typography/TypographyBase.vue.js +2 -2
- package/es/Upload/Upload.vue.d.ts +3 -0
- package/es/Upload/Upload.vue.js +15 -3
- package/es/Upload/UploadButton.vue.js +1 -1
- package/es/Upload/UploadFileList.vue.js +1 -1
- package/es/Upload/UploadFileList.vue2.js +4 -8
- package/es/Upload/UploadPictureCard.vue.js +1 -1
- package/es/Upload/UploadPictureCard.vue2.js +13 -17
- package/es/Upload/hooks/useContext.d.ts +8 -2
- package/es/Upload/hooks/useContext.js +22 -1
- package/es/Upload/hooks/useUpload.d.ts +11 -5
- package/es/Upload/hooks/useUpload.js +29 -6
- package/es/Upload/index.d.ts +9 -0
- package/es/Upload/type.d.ts +6 -0
- package/es/_shared/icons/IconCopy.vue.js +19 -1
- package/es/_shared/icons/IconCopy.vue2.js +1 -19
- package/es/_shared/icons/IconDelete.vue.js +1 -19
- package/es/_shared/icons/IconDelete.vue2.js +19 -1
- package/es/_shared/icons/IconEdit.vue.js +19 -1
- package/es/_shared/icons/IconEdit.vue2.js +1 -19
- package/es/_shared/icons/IconExclamation.vue.js +30 -1
- package/es/_shared/icons/IconExclamation.vue2.js +1 -30
- package/es/_shared/icons/IconEyeClose.vue.js +1 -23
- package/es/_shared/icons/IconEyeClose.vue2.js +23 -1
- package/es/_shared/icons/IconFile.vue.js +1 -19
- package/es/_shared/icons/IconFile.vue2.js +19 -1
- package/es/_shared/icons/IconUpload.vue.js +1 -19
- package/es/_shared/icons/IconUpload.vue2.js +19 -1
- package/es/index.d.ts +2 -1
- package/es/index.js +1 -0
- package/es/style.css +1 -1
- package/lib/Input/InputSuffix.vue.js +1 -1
- package/lib/Progress/ProgressCircle.vue.js +1 -1
- package/lib/Transfer/TransferPanel.vue.js +1 -1
- package/lib/Typography/TypographyBase.vue.js +1 -1
- package/lib/Upload/Upload.vue.d.ts +3 -0
- package/lib/Upload/Upload.vue.js +1 -1
- package/lib/Upload/UploadButton.vue.js +1 -1
- package/lib/Upload/UploadFileList.vue.js +1 -1
- package/lib/Upload/UploadFileList.vue2.js +1 -1
- package/lib/Upload/UploadPictureCard.vue.js +1 -1
- package/lib/Upload/UploadPictureCard.vue2.js +1 -1
- package/lib/Upload/hooks/useContext.d.ts +8 -2
- package/lib/Upload/hooks/useContext.js +1 -1
- package/lib/Upload/hooks/useUpload.d.ts +11 -5
- package/lib/Upload/hooks/useUpload.js +1 -1
- package/lib/Upload/index.d.ts +9 -0
- package/lib/Upload/type.d.ts +6 -0
- package/lib/_shared/icons/IconCopy.vue.js +1 -1
- package/lib/_shared/icons/IconCopy.vue2.js +1 -1
- package/lib/_shared/icons/IconDelete.vue.js +1 -1
- package/lib/_shared/icons/IconDelete.vue2.js +1 -1
- package/lib/_shared/icons/IconEdit.vue.js +1 -1
- package/lib/_shared/icons/IconEdit.vue2.js +1 -1
- package/lib/_shared/icons/IconExclamation.vue.js +1 -1
- package/lib/_shared/icons/IconExclamation.vue2.js +1 -1
- package/lib/_shared/icons/IconEyeClose.vue.js +1 -1
- package/lib/_shared/icons/IconEyeClose.vue2.js +1 -1
- package/lib/_shared/icons/IconFile.vue.js +1 -1
- package/lib/_shared/icons/IconFile.vue2.js +1 -1
- package/lib/_shared/icons/IconUpload.vue.js +1 -1
- package/lib/_shared/icons/IconUpload.vue2.js +1 -1
- package/lib/index.d.ts +2 -1
- package/lib/index.js +1 -1
- package/lib/style.css +1 -1
- package/package.json +1 -1
@@ -5,7 +5,7 @@ import _sfc_main$1 from "../_shared/components/PreventFocus/index.vue.js";
|
|
5
5
|
import "../_shared/utils/dom.js";
|
6
6
|
/* empty css */
|
7
7
|
/* empty css */
|
8
|
-
import _sfc_main$4 from "../_shared/icons/IconEyeClose.
|
8
|
+
import _sfc_main$4 from "../_shared/icons/IconEyeClose.vue2.js";
|
9
9
|
import _sfc_main$3 from "../_shared/icons/IconEyeOpen.vue2.js";
|
10
10
|
const _hoisted_1 = {
|
11
11
|
key: 0,
|
@@ -5,7 +5,7 @@ import { valueToPx } from "../_shared/utils/dom.js";
|
|
5
5
|
/* empty css */
|
6
6
|
/* empty css */
|
7
7
|
import _sfc_main$1 from "../_shared/icons/IconCheck.vue.js";
|
8
|
-
import _sfc_main$2 from "../_shared/icons/IconExclamation.
|
8
|
+
import _sfc_main$2 from "../_shared/icons/IconExclamation.vue.js";
|
9
9
|
import { TYPE_ICON_COLOR_MAP } from "../_shared/constants/index.js";
|
10
10
|
const _hoisted_1 = ["aria-valuenow"];
|
11
11
|
const _hoisted_2 = ["viewBox"];
|
@@ -5,7 +5,7 @@ import "../_shared/utils/dom.js";
|
|
5
5
|
/* empty css */
|
6
6
|
/* empty css */
|
7
7
|
import _sfc_main$4 from "../_shared/icons/IconClose.vue.js";
|
8
|
-
import _sfc_main$2 from "../_shared/icons/IconDelete.
|
8
|
+
import _sfc_main$2 from "../_shared/icons/IconDelete.vue2.js";
|
9
9
|
import _sfc_main$3 from "../_shared/icons/IconSearch.vue2.js";
|
10
10
|
import useTransferContext from "./hooks/useContext.js";
|
11
11
|
import Checkbox from "../Checkbox/index.js";
|
@@ -6,8 +6,8 @@ import { useClipboard } from "../node_modules/@vueuse/core/index.js";
|
|
6
6
|
/* empty css */
|
7
7
|
/* empty css */
|
8
8
|
/* empty css */
|
9
|
-
import _sfc_main$3 from "../_shared/icons/IconCopy.
|
10
|
-
import _sfc_main$1 from "../_shared/icons/IconEdit.
|
9
|
+
import _sfc_main$3 from "../_shared/icons/IconCopy.vue.js";
|
10
|
+
import _sfc_main$1 from "../_shared/icons/IconEdit.vue.js";
|
11
11
|
import _sfc_main$2 from "../_shared/icons/IconInfo.vue.js";
|
12
12
|
import Input from "../Input/index.js";
|
13
13
|
import Tooltip from "../Tooltip/index.js";
|
@@ -41,6 +41,9 @@ declare const __VLS_component: import('vue').DefineComponent<UploadProps, {
|
|
41
41
|
accept: string;
|
42
42
|
showFileList: boolean;
|
43
43
|
showUploadButton: boolean;
|
44
|
+
onBeforeUpload: import('./type').OnBeforeUpload;
|
45
|
+
onBeforeRemove: import('./type').OnBeforeRemove;
|
46
|
+
onButtonClick: import('./type').OnButtonClick;
|
44
47
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
45
48
|
uploadRef: HTMLDivElement;
|
46
49
|
}, HTMLDivElement>;
|
package/es/Upload/Upload.vue.js
CHANGED
@@ -31,7 +31,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
31
31
|
imageLoading: { default: "lazy" },
|
32
32
|
listType: { default: "text" },
|
33
33
|
customIcon: { default: () => ({}) },
|
34
|
-
imagePreview: { type: Boolean }
|
34
|
+
imagePreview: { type: Boolean },
|
35
|
+
onBeforeUpload: { type: Function, default: () => true },
|
36
|
+
onBeforeRemove: { type: Function, default: () => Promise.resolve(true) },
|
37
|
+
onButtonClick: { type: Function, default: () => {
|
38
|
+
} }
|
35
39
|
},
|
36
40
|
emits: ["update:fileList", "exceed-limit", "change", "preview"],
|
37
41
|
setup(__props, { expose: __expose, emit: __emit }) {
|
@@ -39,7 +43,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
39
43
|
const props = __props;
|
40
44
|
const emits = __emit;
|
41
45
|
const uploadRef = ref();
|
42
|
-
const {
|
46
|
+
const {
|
47
|
+
computedFileList,
|
48
|
+
limit,
|
49
|
+
draggable,
|
50
|
+
disabled,
|
51
|
+
handleFiles,
|
52
|
+
handleUpload
|
53
|
+
} = useUpload(uploadRef, props, emits);
|
43
54
|
__expose({
|
44
55
|
updateFile(id, file) {
|
45
56
|
const index = computedFileList.value.findIndex((item) => item.uid == id);
|
@@ -78,7 +89,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
78
89
|
]),
|
79
90
|
ref_key: "uploadRef",
|
80
91
|
ref: uploadRef,
|
81
|
-
onClick: _cache[0] || (_cache[0] =
|
92
|
+
onClick: _cache[0] || (_cache[0] = //@ts-ignore
|
93
|
+
(...args) => unref(handleUpload) && unref(handleUpload)(...args))
|
82
94
|
}, [
|
83
95
|
unref(limit) <= 0 || unref(computedFileList).length < unref(limit) ? renderSlot(_ctx.$slots, "upload-button", { key: 0 }, () => [
|
84
96
|
unref(draggable) ? (openBlock(), createBlock(_sfc_main$1, { key: 0 })) : (openBlock(), createBlock(_sfc_main$2, { key: 1 }))
|
@@ -4,7 +4,7 @@ import "../_shared/utils/dom.js";
|
|
4
4
|
/* empty css */
|
5
5
|
/* empty css */
|
6
6
|
/* empty css */
|
7
|
-
import _sfc_main$1 from "../_shared/icons/IconUpload.
|
7
|
+
import _sfc_main$1 from "../_shared/icons/IconUpload.vue2.js";
|
8
8
|
import Button from "../Button/index.js";
|
9
9
|
const _hoisted_1 = { class: "yc-upload-button" };
|
10
10
|
const _hoisted_2 = {
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import _sfc_main from "./UploadFileList.vue2.js";
|
2
2
|
/* empty css */
|
3
3
|
import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
|
4
|
-
const UploadFileList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
4
|
+
const UploadFileList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2b2e07dc"]]);
|
5
5
|
export {
|
6
6
|
UploadFileList as default
|
7
7
|
};
|
@@ -5,8 +5,8 @@ import _sfc_main$1 from "../_shared/components/IconButton/index.vue.js";
|
|
5
5
|
import "../_shared/utils/dom.js";
|
6
6
|
/* empty css */
|
7
7
|
/* empty css */
|
8
|
-
import _sfc_main$3 from "../_shared/icons/IconDelete.
|
9
|
-
import _sfc_main$2 from "../_shared/icons/IconFile.
|
8
|
+
import _sfc_main$3 from "../_shared/icons/IconDelete.vue2.js";
|
9
|
+
import _sfc_main$2 from "../_shared/icons/IconFile.vue2.js";
|
10
10
|
const _hoisted_1 = { class: "yc-upload-list-item-content" };
|
11
11
|
const _hoisted_2 = {
|
12
12
|
key: 0,
|
@@ -36,12 +36,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
36
36
|
download,
|
37
37
|
customIcon,
|
38
38
|
slots,
|
39
|
-
|
39
|
+
handleDelFile
|
40
40
|
} = useUploadContext().inject();
|
41
|
-
const handleDel = (uid) => {
|
42
|
-
computedFileList.value = computedFileList.value.filter((v) => v.uid != uid);
|
43
|
-
emits("change", computedFileList.value, []);
|
44
|
-
};
|
45
41
|
const renderFileIcon = (fileItem) => {
|
46
42
|
var _a, _b;
|
47
43
|
if (slots["file-icon"]) {
|
@@ -106,7 +102,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
106
102
|
], true),
|
107
103
|
_ctx.$slots["extra-button"] || unref(showRemoveButton) ? (openBlock(), createElementBlock("span", _hoisted_8, [
|
108
104
|
createVNode(unref(_sfc_main$1), {
|
109
|
-
onClick: ($event) =>
|
105
|
+
onClick: ($event) => unref(handleDelFile)(item)
|
110
106
|
}, {
|
111
107
|
default: withCtx(() => [
|
112
108
|
(openBlock(), createBlock(resolveDynamicComponent(renderDelIcon())))
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import _sfc_main from "./UploadPictureCard.vue2.js";
|
2
2
|
/* empty css */
|
3
3
|
import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
|
4
|
-
const UploadPictureCard = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
4
|
+
const UploadPictureCard = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2914d73a"]]);
|
5
5
|
export {
|
6
6
|
UploadPictureCard as default
|
7
7
|
};
|
@@ -1,12 +1,12 @@
|
|
1
|
-
import { defineComponent, ref, createElementBlock, openBlock, normalizeClass, unref, createVNode,
|
1
|
+
import { defineComponent, ref, createElementBlock, openBlock, normalizeClass, unref, createVNode, createCommentVNode, Fragment, renderList, createElementVNode, createBlock, resolveDynamicComponent, toDisplayString } from "vue";
|
2
|
+
import useUpload from "./hooks/useUpload.js";
|
2
3
|
import "../_shared/utils/dom.js";
|
3
4
|
/* empty css */
|
4
5
|
/* empty css */
|
5
6
|
/* empty css */
|
6
|
-
import _sfc_main$3 from "../_shared/icons/IconDelete.
|
7
|
-
import _sfc_main$4 from "../_shared/icons/IconEyeClose.
|
7
|
+
import _sfc_main$3 from "../_shared/icons/IconDelete.vue2.js";
|
8
|
+
import _sfc_main$4 from "../_shared/icons/IconEyeClose.vue2.js";
|
8
9
|
import _sfc_main$2 from "../_shared/icons/IconPlus.vue.js";
|
9
|
-
import useUpload from "./hooks/useUpload.js";
|
10
10
|
import "../Image/index.js";
|
11
11
|
import _sfc_main$1 from "../Image/ImagePreview.vue.js";
|
12
12
|
/* empty css */
|
@@ -28,6 +28,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
28
28
|
const url = ref("");
|
29
29
|
const {
|
30
30
|
computedFileList,
|
31
|
+
limit,
|
31
32
|
tip,
|
32
33
|
slots,
|
33
34
|
customIcon,
|
@@ -36,7 +37,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
36
37
|
showPreviewButton,
|
37
38
|
showRemoveButton,
|
38
39
|
listType,
|
39
|
-
|
40
|
+
handleUpload,
|
41
|
+
handleDelFile,
|
40
42
|
emits
|
41
43
|
} = useUpload(uploadRef);
|
42
44
|
const renderDelIcon = () => {
|
@@ -45,20 +47,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
45
47
|
const renderPreviewIcon = () => {
|
46
48
|
return slots["preview-icon"] ?? (customIcon.value.previewIcon || _sfc_main$4);
|
47
49
|
};
|
48
|
-
const handleUpload = () => {
|
49
|
-
if (disabled.value) return;
|
50
|
-
open();
|
51
|
-
};
|
52
50
|
const handlePreview = (fileItem) => {
|
53
51
|
url.value = fileItem.url;
|
54
52
|
emits("preview", fileItem);
|
55
53
|
if (!imagePreview.value) return;
|
56
54
|
visible.value = true;
|
57
55
|
};
|
58
|
-
const handleDel = (uid) => {
|
59
|
-
computedFileList.value = computedFileList.value.filter((v) => v.uid != uid);
|
60
|
-
emits("change", computedFileList.value, []);
|
61
|
-
};
|
62
56
|
return (_ctx, _cache) => {
|
63
57
|
return openBlock(), createElementBlock("div", {
|
64
58
|
class: normalizeClass([
|
@@ -95,7 +89,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
95
89
|
unref(showRemoveButton) ? (openBlock(), createElementBlock("span", {
|
96
90
|
key: 1,
|
97
91
|
class: normalizeClass(["yc-upload-icon", "yc-upload-icon-remove"]),
|
98
|
-
onClick: ($event) =>
|
92
|
+
onClick: ($event) => unref(handleDelFile)(item)
|
99
93
|
}, [
|
100
94
|
(openBlock(), createBlock(resolveDynamicComponent(renderDelIcon())))
|
101
95
|
], 8, _hoisted_5)) : createCommentVNode("", true)
|
@@ -103,11 +97,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
103
97
|
])
|
104
98
|
]);
|
105
99
|
}), 128)),
|
106
|
-
|
100
|
+
unref(limit) <= 0 || unref(computedFileList).length < unref(limit) ? (openBlock(), createElementBlock("span", {
|
101
|
+
key: 0,
|
107
102
|
class: "yc-upload",
|
108
103
|
ref_key: "uploadRef",
|
109
104
|
ref: uploadRef,
|
110
|
-
onClick:
|
105
|
+
onClick: _cache[1] || (_cache[1] = //@ts-ignore
|
106
|
+
(...args) => unref(handleUpload) && unref(handleUpload)(...args))
|
111
107
|
}, [
|
112
108
|
createElementVNode("div", {
|
113
109
|
class: normalizeClass([
|
@@ -122,7 +118,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
122
118
|
]),
|
123
119
|
unref(tip) ? (openBlock(), createElementBlock("div", _hoisted_7, toDisplayString(unref(tip)), 1)) : createCommentVNode("", true)
|
124
120
|
], 2)
|
125
|
-
], 512)
|
121
|
+
], 512)) : createCommentVNode("", true)
|
126
122
|
], 2);
|
127
123
|
};
|
128
124
|
}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import { Ref } from 'vue';
|
2
|
-
import { UploadEmits, FileItem, FileListType, ImageLoading, UploadSlots, CustomIcon, FileName } from '../type';
|
2
|
+
import { UploadEmits, FileItem, FileListType, ImageLoading, UploadSlots, CustomIcon, FileName, OnBeforeUpload, OnButtonClick } from '../type';
|
3
3
|
import { RecordType } from '../../_shared/type';
|
4
4
|
type UploadContext = {
|
5
5
|
computedFileList: Ref<FileItem[]>;
|
@@ -20,6 +20,9 @@ type UploadContext = {
|
|
20
20
|
showPreviewButton: Ref<boolean>;
|
21
21
|
imagePreview: Ref<boolean>;
|
22
22
|
slots: UploadSlots;
|
23
|
+
onBeforeUpload: OnBeforeUpload;
|
24
|
+
onButtonClick: OnButtonClick;
|
25
|
+
handleDelFile: (fileItem: FileItem) => Promise<void>;
|
23
26
|
emits: UploadEmits;
|
24
27
|
};
|
25
28
|
export default function useUploadContext(): {
|
@@ -40,8 +43,11 @@ export default function useUploadContext(): {
|
|
40
43
|
imagePreview: Ref<boolean, boolean>;
|
41
44
|
showRemoveButton: Ref<boolean, boolean>;
|
42
45
|
showPreviewButton: Ref<boolean, boolean>;
|
43
|
-
name:
|
46
|
+
name: FileName;
|
44
47
|
slots: UploadSlots;
|
48
|
+
onBeforeUpload: OnBeforeUpload;
|
49
|
+
onButtonClick: OnButtonClick;
|
50
|
+
handleDelFile: (fileItem: FileItem) => Promise<void>;
|
45
51
|
emits: UploadEmits;
|
46
52
|
};
|
47
53
|
inject: () => UploadContext;
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import { toRefs, useSlots, computed, provide, inject, ref } from "vue";
|
2
2
|
import { useControlValue } from "../../_shared/utils/control.js";
|
3
|
+
import { isFunction } from "../../_shared/utils/is.js";
|
3
4
|
const UPLOAD_CONTEXT_KEY = "upload-context";
|
4
5
|
function useUploadContext() {
|
5
6
|
const provide$1 = (props, emits) => {
|
@@ -22,7 +23,7 @@ function useUploadContext() {
|
|
22
23
|
showPreviewButton,
|
23
24
|
accept: _accept
|
24
25
|
} = toRefs(props);
|
25
|
-
const { name } = props;
|
26
|
+
const { name, onBeforeUpload, onBeforeRemove, onButtonClick } = props;
|
26
27
|
const slots = useSlots();
|
27
28
|
const computedFileList = useControlValue(
|
28
29
|
fileList,
|
@@ -34,6 +35,19 @@ function useUploadContext() {
|
|
34
35
|
const accept = computed(() => {
|
35
36
|
return listType.value != "text" ? "image/*" : _accept.value;
|
36
37
|
});
|
38
|
+
const handleDelFile = async (fileItem) => {
|
39
|
+
let isDel = true;
|
40
|
+
try {
|
41
|
+
isDel = await (onBeforeRemove == null ? void 0 : onBeforeRemove(fileItem));
|
42
|
+
} catch {
|
43
|
+
isDel = false;
|
44
|
+
}
|
45
|
+
if (!isDel && isFunction(onBeforeRemove)) return;
|
46
|
+
computedFileList.value = computedFileList.value.filter(
|
47
|
+
(v) => v.uid != fileItem.uid
|
48
|
+
);
|
49
|
+
emits("change", computedFileList.value, []);
|
50
|
+
};
|
37
51
|
const context = {
|
38
52
|
computedFileList,
|
39
53
|
accept,
|
@@ -53,6 +67,9 @@ function useUploadContext() {
|
|
53
67
|
showPreviewButton,
|
54
68
|
name,
|
55
69
|
slots,
|
70
|
+
onBeforeUpload,
|
71
|
+
onButtonClick,
|
72
|
+
handleDelFile,
|
56
73
|
emits
|
57
74
|
};
|
58
75
|
provide(UPLOAD_CONTEXT_KEY, context);
|
@@ -78,6 +95,10 @@ function useUploadContext() {
|
|
78
95
|
showPreviewButton: ref(true),
|
79
96
|
name: "",
|
80
97
|
slots: {},
|
98
|
+
handleDelFile: () => Promise.resolve(),
|
99
|
+
onButtonClick: () => {
|
100
|
+
},
|
101
|
+
onBeforeUpload: () => true,
|
81
102
|
emits: () => {
|
82
103
|
}
|
83
104
|
});
|
@@ -1,8 +1,8 @@
|
|
1
1
|
import { FileItem, UploadEmits, UploadProps } from '../type';
|
2
2
|
import { Ref } from 'vue';
|
3
3
|
export default function useUpload(uploadRef: Ref<HTMLDivElement | undefined>, _props?: UploadProps, _emits?: UploadEmits): {
|
4
|
-
|
5
|
-
handleFiles: (fileData: File[] | FileList | null) => void
|
4
|
+
handleUpload: (e: MouseEvent) => Promise<void>;
|
5
|
+
handleFiles: (fileData: File[] | FileList | null) => Promise<void>;
|
6
6
|
computedFileList: Ref<FileItem[]>;
|
7
7
|
disabled: Ref<boolean>;
|
8
8
|
tip: Ref<string>;
|
@@ -21,10 +21,13 @@ export default function useUpload(uploadRef: Ref<HTMLDivElement | undefined>, _p
|
|
21
21
|
showPreviewButton: Ref<boolean>;
|
22
22
|
imagePreview: Ref<boolean>;
|
23
23
|
slots: import('..').UploadSlots;
|
24
|
+
onBeforeUpload: import('..').OnBeforeUpload;
|
25
|
+
onButtonClick: import('..').OnButtonClick;
|
26
|
+
handleDelFile: (fileItem: FileItem) => Promise<void>;
|
24
27
|
emits: UploadEmits;
|
25
28
|
} | {
|
26
|
-
|
27
|
-
handleFiles: (fileData: File[] | FileList | null) => void
|
29
|
+
handleUpload: (e: MouseEvent) => Promise<void>;
|
30
|
+
handleFiles: (fileData: File[] | FileList | null) => Promise<void>;
|
28
31
|
computedFileList: import('vue').WritableComputedRef<FileItem[], FileItem[]>;
|
29
32
|
accept: import('vue').ComputedRef<string>;
|
30
33
|
disabled: Ref<boolean, boolean>;
|
@@ -41,7 +44,10 @@ export default function useUpload(uploadRef: Ref<HTMLDivElement | undefined>, _p
|
|
41
44
|
imagePreview: Ref<boolean, boolean>;
|
42
45
|
showRemoveButton: Ref<boolean, boolean>;
|
43
46
|
showPreviewButton: Ref<boolean, boolean>;
|
44
|
-
name:
|
47
|
+
name: import('..').FileName;
|
45
48
|
slots: import('..').UploadSlots;
|
49
|
+
onBeforeUpload: import('..').OnBeforeUpload;
|
50
|
+
onButtonClick: import('..').OnButtonClick;
|
51
|
+
handleDelFile: (fileItem: FileItem) => Promise<void>;
|
46
52
|
emits: UploadEmits;
|
47
53
|
};
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import { nanoid } from "../../node_modules/nanoid/index.browser.js";
|
2
2
|
import "vue";
|
3
|
-
import { isString } from "../../_shared/utils/is.js";
|
3
|
+
import { isFunction, isString } from "../../_shared/utils/is.js";
|
4
4
|
import { useFileDialog, useDropZone } from "../../node_modules/@vueuse/core/index.js";
|
5
5
|
import useUploadContext from "./useContext.js";
|
6
6
|
function useUpload(uploadRef, _props, _emits) {
|
@@ -18,6 +18,8 @@ function useUpload(uploadRef, _props, _emits) {
|
|
18
18
|
directory,
|
19
19
|
multiple,
|
20
20
|
name,
|
21
|
+
onBeforeUpload,
|
22
|
+
onButtonClick,
|
21
23
|
emits
|
22
24
|
} = context;
|
23
25
|
const { onChange, open } = useFileDialog({
|
@@ -42,9 +44,20 @@ function useUpload(uploadRef, _props, _emits) {
|
|
42
44
|
}
|
43
45
|
return fileItem.name;
|
44
46
|
};
|
45
|
-
const handleFiles = (fileData) => {
|
46
|
-
const
|
47
|
-
|
47
|
+
const handleFiles = async (fileData) => {
|
48
|
+
const allFiles = [...fileData || []];
|
49
|
+
const files = [];
|
50
|
+
for (const file of allFiles) {
|
51
|
+
let isUpload = true;
|
52
|
+
try {
|
53
|
+
isUpload = await (onBeforeUpload == null ? void 0 : onBeforeUpload(file));
|
54
|
+
} catch {
|
55
|
+
isUpload = false;
|
56
|
+
}
|
57
|
+
if (!isUpload && isFunction(onBeforeUpload)) continue;
|
58
|
+
files.push(file);
|
59
|
+
}
|
60
|
+
if (!files.length || disabled.value || isOutOfLimit(files.length)) {
|
48
61
|
if (!isOutOfLimit(files == null ? void 0 : files.length)) return;
|
49
62
|
emits("exceed-limit", computedFileList.value, files);
|
50
63
|
return;
|
@@ -66,12 +79,22 @@ function useUpload(uploadRef, _props, _emits) {
|
|
66
79
|
};
|
67
80
|
})
|
68
81
|
];
|
69
|
-
console.dir(computedFileList.value, "files");
|
70
82
|
emits("change", computedFileList.value, [...files]);
|
71
83
|
};
|
84
|
+
const handleUpload = async (e) => {
|
85
|
+
if (disabled.value) return;
|
86
|
+
let click;
|
87
|
+
try {
|
88
|
+
click = onButtonClick == null ? void 0 : onButtonClick(e);
|
89
|
+
if (click instanceof Promise) return;
|
90
|
+
open();
|
91
|
+
} catch (err) {
|
92
|
+
throw err;
|
93
|
+
}
|
94
|
+
};
|
72
95
|
return {
|
73
96
|
...context,
|
74
|
-
|
97
|
+
handleUpload,
|
75
98
|
handleFiles
|
76
99
|
};
|
77
100
|
}
|
package/es/Upload/index.d.ts
CHANGED
@@ -36,6 +36,9 @@ declare const Upload: {
|
|
36
36
|
accept: string;
|
37
37
|
showFileList: boolean;
|
38
38
|
showUploadButton: boolean;
|
39
|
+
onBeforeUpload: import('./type').OnBeforeUpload;
|
40
|
+
onBeforeRemove: import('./type').OnBeforeRemove;
|
41
|
+
onButtonClick: import('./type').OnButtonClick;
|
39
42
|
}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
|
40
43
|
uploadRef: HTMLDivElement;
|
41
44
|
}, HTMLDivElement, import('vue').ComponentProvideOptions, {
|
@@ -73,6 +76,9 @@ declare const Upload: {
|
|
73
76
|
accept: string;
|
74
77
|
showFileList: boolean;
|
75
78
|
showUploadButton: boolean;
|
79
|
+
onBeforeUpload: import('./type').OnBeforeUpload;
|
80
|
+
onBeforeRemove: import('./type').OnBeforeRemove;
|
81
|
+
onButtonClick: import('./type').OnButtonClick;
|
76
82
|
}>;
|
77
83
|
__isFragment?: never;
|
78
84
|
__isTeleport?: never;
|
@@ -110,6 +116,9 @@ declare const Upload: {
|
|
110
116
|
accept: string;
|
111
117
|
showFileList: boolean;
|
112
118
|
showUploadButton: boolean;
|
119
|
+
onBeforeUpload: import('./type').OnBeforeUpload;
|
120
|
+
onBeforeRemove: import('./type').OnBeforeRemove;
|
121
|
+
onButtonClick: import('./type').OnButtonClick;
|
113
122
|
}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
|
114
123
|
$slots: any;
|
115
124
|
}) & {
|
package/es/Upload/type.d.ts
CHANGED
@@ -20,6 +20,9 @@ export interface UploadProps {
|
|
20
20
|
listType?: FileListType;
|
21
21
|
customIcon?: CustomIcon;
|
22
22
|
imagePreview?: boolean;
|
23
|
+
onBeforeUpload?: OnBeforeUpload;
|
24
|
+
onBeforeRemove?: OnBeforeRemove;
|
25
|
+
onButtonClick?: OnButtonClick;
|
23
26
|
}
|
24
27
|
export interface UploadEmits {
|
25
28
|
(e: 'update:fileList', value: FileItem[]): void;
|
@@ -56,6 +59,9 @@ export type FileStatus = 'init' | 'uploading' | 'done' | 'error' | 'removed';
|
|
56
59
|
export type FileName = string | ((fileItem: FileItem) => string);
|
57
60
|
export type FileListType = 'text' | 'picture' | 'picture-card';
|
58
61
|
export type ImageLoading = 'eager' | 'lazy';
|
62
|
+
export type OnBeforeUpload = (file: File) => boolean | Promise<boolean>;
|
63
|
+
export type OnBeforeRemove = (fileItem: FileItem) => Promise<boolean>;
|
64
|
+
export type OnButtonClick = (event: Event) => Promise<FileList> | void;
|
59
65
|
export type FileItem = {
|
60
66
|
uid: string;
|
61
67
|
name: string;
|
@@ -1,4 +1,22 @@
|
|
1
|
-
import
|
1
|
+
import { defineComponent, createBlock, openBlock, unref, normalizeProps, guardReactiveProps, withCtx, createElementVNode } from "vue";
|
2
|
+
import "../utils/dom.js";
|
3
|
+
/* empty css */
|
4
|
+
/* empty css */
|
5
|
+
import _sfc_main$1 from "../components/Icon/index.vue3.js";
|
6
|
+
/* empty css */
|
7
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
8
|
+
__name: "IconCopy",
|
9
|
+
setup(__props) {
|
10
|
+
return (_ctx, _cache) => {
|
11
|
+
return openBlock(), createBlock(unref(_sfc_main$1), normalizeProps(guardReactiveProps(_ctx.$attrs)), {
|
12
|
+
default: withCtx(() => [..._cache[0] || (_cache[0] = [
|
13
|
+
createElementVNode("path", { d: "M20 6h18a2 2 0 0 1 2 2v22M8 16v24c0 1.105.891 2 1.996 2h20.007A1.99 1.99 0 0 0 32 40.008V15.997A1.997 1.997 0 0 0 30 14H10a2 2 0 0 0-2 2Z" }, null, -1)
|
14
|
+
])]),
|
15
|
+
_: 1
|
16
|
+
}, 16);
|
17
|
+
};
|
18
|
+
}
|
19
|
+
});
|
2
20
|
export {
|
3
21
|
_sfc_main as default
|
4
22
|
};
|
@@ -1,22 +1,4 @@
|
|
1
|
-
import
|
2
|
-
import "../utils/dom.js";
|
3
|
-
/* empty css */
|
4
|
-
/* empty css */
|
5
|
-
import _sfc_main$1 from "../components/Icon/index.vue3.js";
|
6
|
-
/* empty css */
|
7
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
8
|
-
__name: "IconCopy",
|
9
|
-
setup(__props) {
|
10
|
-
return (_ctx, _cache) => {
|
11
|
-
return openBlock(), createBlock(unref(_sfc_main$1), normalizeProps(guardReactiveProps(_ctx.$attrs)), {
|
12
|
-
default: withCtx(() => [..._cache[0] || (_cache[0] = [
|
13
|
-
createElementVNode("path", { d: "M20 6h18a2 2 0 0 1 2 2v22M8 16v24c0 1.105.891 2 1.996 2h20.007A1.99 1.99 0 0 0 32 40.008V15.997A1.997 1.997 0 0 0 30 14H10a2 2 0 0 0-2 2Z" }, null, -1)
|
14
|
-
])]),
|
15
|
-
_: 1
|
16
|
-
}, 16);
|
17
|
-
};
|
18
|
-
}
|
19
|
-
});
|
1
|
+
import _sfc_main from "./IconCopy.vue.js";
|
20
2
|
export {
|
21
3
|
_sfc_main as default
|
22
4
|
};
|
@@ -1,22 +1,4 @@
|
|
1
|
-
import
|
2
|
-
import "../utils/dom.js";
|
3
|
-
/* empty css */
|
4
|
-
/* empty css */
|
5
|
-
import _sfc_main$1 from "../components/Icon/index.vue3.js";
|
6
|
-
/* empty css */
|
7
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
8
|
-
__name: "IconDelete",
|
9
|
-
setup(__props) {
|
10
|
-
return (_ctx, _cache) => {
|
11
|
-
return openBlock(), createBlock(unref(_sfc_main$1), normalizeProps(guardReactiveProps(_ctx.$attrs)), {
|
12
|
-
default: withCtx(() => [..._cache[0] || (_cache[0] = [
|
13
|
-
createElementVNode("path", { d: "M5 11h5.5m0 0v29a1 1 0 0 0 1 1h25a1 1 0 0 0 1-1V11m-27 0H16m21.5 0H43m-5.5 0H32m-16 0V7h16v4m-16 0h16M20 18v15m8-15v15" }, null, -1)
|
14
|
-
])]),
|
15
|
-
_: 1
|
16
|
-
}, 16);
|
17
|
-
};
|
18
|
-
}
|
19
|
-
});
|
1
|
+
import _sfc_main from "./IconDelete.vue2.js";
|
20
2
|
export {
|
21
3
|
_sfc_main as default
|
22
4
|
};
|
@@ -1,4 +1,22 @@
|
|
1
|
-
import
|
1
|
+
import { defineComponent, createBlock, openBlock, unref, normalizeProps, guardReactiveProps, withCtx, createElementVNode } from "vue";
|
2
|
+
import "../utils/dom.js";
|
3
|
+
/* empty css */
|
4
|
+
/* empty css */
|
5
|
+
import _sfc_main$1 from "../components/Icon/index.vue3.js";
|
6
|
+
/* empty css */
|
7
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
8
|
+
__name: "IconDelete",
|
9
|
+
setup(__props) {
|
10
|
+
return (_ctx, _cache) => {
|
11
|
+
return openBlock(), createBlock(unref(_sfc_main$1), normalizeProps(guardReactiveProps(_ctx.$attrs)), {
|
12
|
+
default: withCtx(() => [..._cache[0] || (_cache[0] = [
|
13
|
+
createElementVNode("path", { d: "M5 11h5.5m0 0v29a1 1 0 0 0 1 1h25a1 1 0 0 0 1-1V11m-27 0H16m21.5 0H43m-5.5 0H32m-16 0V7h16v4m-16 0h16M20 18v15m8-15v15" }, null, -1)
|
14
|
+
])]),
|
15
|
+
_: 1
|
16
|
+
}, 16);
|
17
|
+
};
|
18
|
+
}
|
19
|
+
});
|
2
20
|
export {
|
3
21
|
_sfc_main as default
|
4
22
|
};
|
@@ -1,4 +1,22 @@
|
|
1
|
-
import
|
1
|
+
import { defineComponent, createBlock, openBlock, unref, normalizeProps, guardReactiveProps, withCtx, createElementVNode } from "vue";
|
2
|
+
import "../utils/dom.js";
|
3
|
+
/* empty css */
|
4
|
+
/* empty css */
|
5
|
+
import _sfc_main$1 from "../components/Icon/index.vue3.js";
|
6
|
+
/* empty css */
|
7
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
8
|
+
__name: "IconEdit",
|
9
|
+
setup(__props) {
|
10
|
+
return (_ctx, _cache) => {
|
11
|
+
return openBlock(), createBlock(unref(_sfc_main$1), normalizeProps(guardReactiveProps(_ctx.$attrs)), {
|
12
|
+
default: withCtx(() => [..._cache[0] || (_cache[0] = [
|
13
|
+
createElementVNode("path", { d: "m30.48 19.038 5.733-5.734a1 1 0 0 0 0-1.414l-5.586-5.586a1 1 0 0 0-1.414 0l-5.734 5.734m7 7L15.763 33.754a1 1 0 0 1-.59.286l-6.048.708a1 1 0 0 1-1.113-1.069l.477-6.31a1 1 0 0 1 .29-.631l14.7-14.7m7 7-7-7M6 42h36" }, null, -1)
|
14
|
+
])]),
|
15
|
+
_: 1
|
16
|
+
}, 16);
|
17
|
+
};
|
18
|
+
}
|
19
|
+
});
|
2
20
|
export {
|
3
21
|
_sfc_main as default
|
4
22
|
};
|
@@ -1,22 +1,4 @@
|
|
1
|
-
import
|
2
|
-
import "../utils/dom.js";
|
3
|
-
/* empty css */
|
4
|
-
/* empty css */
|
5
|
-
import _sfc_main$1 from "../components/Icon/index.vue3.js";
|
6
|
-
/* empty css */
|
7
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
8
|
-
__name: "IconEdit",
|
9
|
-
setup(__props) {
|
10
|
-
return (_ctx, _cache) => {
|
11
|
-
return openBlock(), createBlock(unref(_sfc_main$1), normalizeProps(guardReactiveProps(_ctx.$attrs)), {
|
12
|
-
default: withCtx(() => [..._cache[0] || (_cache[0] = [
|
13
|
-
createElementVNode("path", { d: "m30.48 19.038 5.733-5.734a1 1 0 0 0 0-1.414l-5.586-5.586a1 1 0 0 0-1.414 0l-5.734 5.734m7 7L15.763 33.754a1 1 0 0 1-.59.286l-6.048.708a1 1 0 0 1-1.113-1.069l.477-6.31a1 1 0 0 1 .29-.631l14.7-14.7m7 7-7-7M6 42h36" }, null, -1)
|
14
|
-
])]),
|
15
|
-
_: 1
|
16
|
-
}, 16);
|
17
|
-
};
|
18
|
-
}
|
19
|
-
});
|
1
|
+
import _sfc_main from "./IconEdit.vue.js";
|
20
2
|
export {
|
21
3
|
_sfc_main as default
|
22
4
|
};
|