qidian-vue-ui 2.8.3 → 2.8.4

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.
Files changed (4) hide show
  1. package/dist/components/upload/index.css +45 -45
  2. package/dist/components/upload/index.vue.mjs +1 -1
  3. package/dist/components/upload/index.vue2.mjs +23 -19
  4. package/package.json +1 -1
package/dist/components/upload/index.css CHANGED
@@ -1,76 +1,76 @@
1
- .qd-upload[data-v-a883bc8a] {
1
+ .qd-upload[data-v-15a6df62] {
2
2
  width: 100%;
3
3
  outline: none;
4
4
  }
5
- .qd-upload[data-v-a883bc8a] .t-image-viewer__trigger {
5
+ .qd-upload[data-v-15a6df62] .t-image-viewer__trigger {
6
6
  display: none;
7
7
  }
8
- .qd-upload[data-v-a883bc8a] .t-upload__dragger {
8
+ .qd-upload[data-v-15a6df62] .t-upload__dragger {
9
9
  min-width: auto;
10
10
  min-height: 144px;
11
11
  width: 100%;
12
12
  height: 100%;
13
13
  }
14
- .qd-upload[data-v-a883bc8a] .t-upload__dragger-btns > .t-size-s {
14
+ .qd-upload[data-v-15a6df62] .t-upload__dragger-btns > .t-size-s {
15
15
  display: inline-flex;
16
16
  }
17
- .qd-upload[data-v-a883bc8a] .t-upload__flow {
17
+ .qd-upload[data-v-15a6df62] .t-upload__flow {
18
18
  width: 100%;
19
19
  min-width: auto;
20
20
  max-width: 100%;
21
21
  }
22
- .qd-upload[data-v-a883bc8a] .t-upload__flow-empty {
22
+ .qd-upload[data-v-15a6df62] .t-upload__flow-empty {
23
23
  height: auto;
24
24
  min-height: 144px;
25
25
  }
26
- .qd-upload[data-v-a883bc8a] .t-upload__flow-card-area,
27
- .qd-upload[data-v-a883bc8a] .t-upload__flow-table {
26
+ .qd-upload[data-v-15a6df62] .t-upload__flow-card-area,
27
+ .qd-upload[data-v-15a6df62] .t-upload__flow-table {
28
28
  margin-top: var(--td-comp-margin-s);
29
29
  }
30
- .qd-upload[data-v-a883bc8a] .t-upload__file-name__container {
30
+ .qd-upload[data-v-15a6df62] .t-upload__file-name__container {
31
31
  display: flex;
32
32
  align-items: center;
33
33
  }
34
- .qd-upload[data-v-a883bc8a] .t-upload__file-name-text {
34
+ .qd-upload[data-v-15a6df62] .t-upload__file-name-text {
35
35
  cursor: pointer;
36
36
  }
37
- .qd-upload[data-v-a883bc8a] .t-upload__file-thumbnail {
37
+ .qd-upload[data-v-15a6df62] .t-upload__file-thumbnail {
38
38
  width: var(--td-comp-size-m);
39
39
  height: var(--td-comp-size-m);
40
40
  }
41
- .qd-upload[data-v-a883bc8a] .t-upload__card-image {
41
+ .qd-upload[data-v-15a6df62] .t-upload__card-image {
42
42
  width: 100%;
43
43
  height: 100%;
44
44
  }
45
- .qd-upload__popup-upload[data-v-a883bc8a] .t-image-viewer__trigger {
45
+ .qd-upload__popup-upload[data-v-15a6df62] .t-image-viewer__trigger {
46
46
  display: none;
47
47
  }
48
- .qd-upload__popup-upload[data-v-a883bc8a] .t-upload__flow-table {
48
+ .qd-upload__popup-upload[data-v-15a6df62] .t-upload__flow-table {
49
49
  margin-top: 0;
50
50
  }
51
- .qd-upload__popup-upload[data-v-a883bc8a] .t-upload__file-name__container {
51
+ .qd-upload__popup-upload[data-v-15a6df62] .t-upload__file-name__container {
52
52
  display: flex;
53
53
  align-items: center;
54
54
  }
55
- .qd-upload__popup-upload[data-v-a883bc8a] .t-upload__file-name-text {
55
+ .qd-upload__popup-upload[data-v-15a6df62] .t-upload__file-name-text {
56
56
  cursor: pointer;
57
57
  }
58
- .qd-upload__popup-upload[data-v-a883bc8a] .t-upload__file-thumbnail {
58
+ .qd-upload__popup-upload[data-v-15a6df62] .t-upload__file-thumbnail {
59
59
  width: var(--td-comp-size-m);
60
60
  height: var(--td-comp-size-m);
61
61
  }
62
- .qd-upload__popup-upload[data-v-a883bc8a] .t-upload__card-image {
62
+ .qd-upload__popup-upload[data-v-15a6df62] .t-upload__card-image {
63
63
  width: 100%;
64
64
  height: 100%;
65
65
  }
66
- .qd-upload__popup-upload--disabled[data-v-a883bc8a] .t-upload__flow-table th:last-child,
67
- .qd-upload__popup-upload--disabled[data-v-a883bc8a] .t-upload__flow-table td:last-child {
66
+ .qd-upload__popup-upload--disabled[data-v-15a6df62] .t-upload__flow-table th:last-child,
67
+ .qd-upload__popup-upload--disabled[data-v-15a6df62] .t-upload__flow-table td:last-child {
68
68
  display: none;
69
69
  }
70
- .qd-upload__popup-actions[data-v-a883bc8a] {
70
+ .qd-upload__popup-actions[data-v-15a6df62] {
71
71
  display: inline-flex;
72
72
  }
73
- .qd-upload__popup-drag-text[data-v-a883bc8a] {
73
+ .qd-upload__popup-drag-text[data-v-15a6df62] {
74
74
  display: flex;
75
75
  align-items: center;
76
76
  justify-content: center;
@@ -78,18 +78,18 @@
78
78
  height: 100%;
79
79
  color: var(--td-text-color-placeholder);
80
80
  }
81
- .qd-upload[data-v-a883bc8a]:focus .t-upload__flow-card-area,
82
- .qd-upload[data-v-a883bc8a]:focus .t-upload__flow-table {
81
+ .qd-upload[data-v-15a6df62]:focus .t-upload__flow-card-area,
82
+ .qd-upload[data-v-15a6df62]:focus .t-upload__flow-table {
83
83
  border-color: var(--td-brand-color);
84
84
  }
85
- .qd-upload--btn-image-popup[data-v-a883bc8a],
86
- .qd-upload--btn-file-popup[data-v-a883bc8a] {
85
+ .qd-upload--btn-image-popup[data-v-15a6df62],
86
+ .qd-upload--btn-file-popup[data-v-15a6df62] {
87
87
  padding: var(--td-comp-paddingTB-s) var(--td-comp-paddingLR-s);
88
88
  border: 1px dashed var(--td-component-border);
89
89
  transition: border 0.2s linear;
90
90
  }
91
- .qd-upload--btn-image-popup[data-v-a883bc8a] .t-upload__dragger,
92
- .qd-upload--btn-file-popup[data-v-a883bc8a] .t-upload__dragger {
91
+ .qd-upload--btn-image-popup[data-v-15a6df62] .t-upload__dragger,
92
+ .qd-upload--btn-file-popup[data-v-15a6df62] .t-upload__dragger {
93
93
  min-height: auto;
94
94
  padding: 0;
95
95
  border: 0;
@@ -98,42 +98,42 @@
98
98
  align-items: flex-start;
99
99
  cursor: default;
100
100
  }
101
- .qd-upload--btn-image-popup[data-v-a883bc8a] .t-upload__dragger > .t-upload__trigger,
102
- .qd-upload--btn-file-popup[data-v-a883bc8a] .t-upload__dragger > .t-upload__trigger {
101
+ .qd-upload--btn-image-popup[data-v-15a6df62] .t-upload__dragger > .t-upload__trigger,
102
+ .qd-upload--btn-file-popup[data-v-15a6df62] .t-upload__dragger > .t-upload__trigger {
103
103
  width: 100%;
104
104
  height: 100%;
105
105
  }
106
- .qd-upload--btn-image-popup[data-v-a883bc8a]:focus-within,
107
- .qd-upload--btn-file-popup[data-v-a883bc8a]:focus-within {
106
+ .qd-upload--btn-image-popup[data-v-15a6df62]:focus-within,
107
+ .qd-upload--btn-file-popup[data-v-15a6df62]:focus-within {
108
108
  border-color: var(--td-brand-color);
109
109
  }
110
- .qd-upload--only-view[data-v-a883bc8a] .t-upload__flow-empty,
111
- .qd-upload--only-view[data-v-a883bc8a] .t-upload__card-mask-item-divider {
110
+ .qd-upload--only-view[data-v-15a6df62] .t-upload__flow-empty,
111
+ .qd-upload--only-view[data-v-15a6df62] .t-upload__card-mask-item-divider {
112
112
  display: none;
113
113
  }
114
- .qd-upload--only-view[data-v-a883bc8a] .t-upload__flow-card-area {
114
+ .qd-upload--only-view[data-v-15a6df62] .t-upload__flow-card-area {
115
115
  border-color: var(--td-component-border);
116
116
  }
117
- .qd-upload--only-view[data-v-a883bc8a]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__flow-op,
118
- .qd-upload--only-view[data-v-a883bc8a]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__trigger,
119
- .qd-upload--only-view[data-v-a883bc8a]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__flow-bottom {
117
+ .qd-upload--only-view[data-v-15a6df62]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__flow-op,
118
+ .qd-upload--only-view[data-v-15a6df62]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__trigger,
119
+ .qd-upload--only-view[data-v-15a6df62]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__flow-bottom {
120
120
  display: none;
121
121
  }
122
- .qd-upload--only-view[data-v-a883bc8a]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__flow-table,
123
- .qd-upload--only-view[data-v-a883bc8a]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__flow-card-area {
122
+ .qd-upload--only-view[data-v-15a6df62]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__flow-table,
123
+ .qd-upload--only-view[data-v-15a6df62]:not(.qd-upload--btn-image-popup):not(.qd-upload--btn-file-popup) .t-upload__flow-card-area {
124
124
  margin-top: 0;
125
125
  }
126
- .qd-upload--uploading[data-v-a883bc8a] .t-upload__single-input-clear {
126
+ .qd-upload--uploading[data-v-15a6df62] .t-upload__single-input-clear {
127
127
  display: none;
128
128
  }
129
- .qd-upload--hide-manual-upload[data-v-a883bc8a] .t-upload__flow-bottom {
129
+ .qd-upload--hide-manual-upload[data-v-15a6df62] .t-upload__flow-bottom {
130
130
  display: none;
131
131
  margin-top: 0;
132
132
  }
133
- .qd-upload--hide-progress[data-v-a883bc8a] .t-upload__flow-table th:last-child,
134
- .qd-upload--hide-progress[data-v-a883bc8a] .t-upload__flow-table td:last-child {
133
+ .qd-upload--hide-progress[data-v-15a6df62] .t-upload__flow-table th:last-child,
134
+ .qd-upload--hide-progress[data-v-15a6df62] .t-upload__flow-table td:last-child {
135
135
  display: none;
136
136
  }
137
- .qd-upload--disabled[data-v-a883bc8a] .t-upload__flow-card-area {
137
+ .qd-upload--disabled[data-v-15a6df62] .t-upload__flow-card-area {
138
138
  border-color: var(--td-component-border);
139
139
  }
package/dist/components/upload/index.vue.mjs CHANGED
@@ -2,7 +2,7 @@ import './index.css'
2
2
  import _sfc_main from "./index.vue2.mjs";
3
3
  /* empty css */
4
4
  import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
5
- const QdUpload = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a883bc8a"]]);
5
+ const QdUpload = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-15a6df62"]]);
6
6
  export {
7
7
  QdUpload as default
8
8
  };
package/dist/components/upload/index.vue2.mjs CHANGED
@@ -1,6 +1,5 @@
1
1
  import './index.css'
2
- import { defineComponent, mergeDefaults, getCurrentInstance, ref, computed, inject, useTemplateRef, watch, nextTick, onMounted, onUnmounted, createBlock, openBlock, unref, mergeProps, createSlots, withCtx, renderList, renderSlot, createElementBlock, createCommentVNode, createTextVNode, toDisplayString, createVNode, withModifiers, normalizeClass, createElementVNode, normalizeProps, guardReactiveProps } from "vue";
3
- import { useVModel } from "../../node_modules/.pnpm/@vueuse_core@14.2.0_vue@3.5.26_typescript@5.9.3_/node_modules/@vueuse/core/dist/index.mjs";
2
+ import { defineComponent, mergeDefaults, ref, getCurrentInstance, watch, computed, inject, useTemplateRef, onMounted, onUnmounted, createBlock, openBlock, unref, mergeProps, createSlots, withCtx, renderList, renderSlot, createElementBlock, createCommentVNode, createTextVNode, toDisplayString, createVNode, withModifiers, normalizeClass, createElementVNode, normalizeProps, guardReactiveProps } from "vue";
4
3
  import dayjs from "../../_virtual/dayjs.min.mjs";
5
4
  import { isEmpty, useTimer, easyCopy, checkSameObject, abortWrapper, to, filterSlots, isTypeByName, suspectedWrapperPromise } from "qidian-shared";
6
5
  import { UploadIcon, BrowseIcon } from "tdesign-icons-vue-next";
@@ -106,14 +105,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
106
105
  setup(__props, { expose: __expose, emit: __emit }) {
107
106
  const props = __props;
108
107
  const emit = __emit;
109
- const modelValue = useVModel(props, "modelValue", emit, {
110
- passive: true
111
- });
108
+ const modelValue = ref(props.modelValue);
112
109
  const hasFilesProp = Object.prototype.hasOwnProperty.call(
113
110
  getCurrentInstance()?.vnode.props,
114
111
  "files"
115
112
  );
116
113
  const fileList = ref([]);
114
+ watch(
115
+ () => props.modelValue,
116
+ (value) => {
117
+ if (Object.is(modelValue.value, value)) return;
118
+ modelValue.value = value;
119
+ }
120
+ );
121
+ watch(modelValue, (value) => {
122
+ if (Object.is(value, props.modelValue)) return;
123
+ emit("update:modelValue", value);
124
+ });
117
125
  const reModelValue = computed({
118
126
  get: () => {
119
127
  const { convStr } = reProps.value;
@@ -145,8 +153,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
145
153
  const uploadRef = useTemplateRef("upload");
146
154
  const { timer: uploadTimer, clearTimer: clearUploadTimer } = useTimer("interval");
147
155
  const waitingUploadFiles = ref([]);
148
- let isSyncingUploadModelValue = false;
149
- let isSyncingFiles = false;
156
+ let internalModelValue = props.modelValue;
150
157
  const tempUrlMap = /* @__PURE__ */ new WeakMap();
151
158
  const removedUploadingFileValues = /* @__PURE__ */ new Set();
152
159
  const tempModelValueSet = /* @__PURE__ */ new Set();
@@ -507,11 +514,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
507
514
  }
508
515
  tempModelValue.push(genTempValue(item));
509
516
  });
510
- isSyncingUploadModelValue = true;
517
+ internalModelValue = tempModelValue;
511
518
  reModelValue.value = tempModelValue;
512
- nextTick(() => {
513
- isSyncingUploadModelValue = false;
514
- });
515
519
  }
516
520
  function revokeTempUrl(file) {
517
521
  if (!file) return;
@@ -619,6 +623,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
619
623
  function clear() {
620
624
  revokeAllTempUrls();
621
625
  removedUploadingFileValues.clear();
626
+ internalModelValue = [];
622
627
  reModelValue.value = [];
623
628
  fileList.value = [];
624
629
  waitingUploadFiles.value = [];
@@ -673,19 +678,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
673
678
  (files) => {
674
679
  if (!hasFilesProp) return;
675
680
  if (!files.length && reModelValue.value.length) return;
676
- isSyncingFiles = true;
677
681
  fileList.value = files;
678
682
  updateTempModelValue(fileList.value);
679
- nextTick(() => {
680
- isSyncingFiles = false;
681
- });
682
683
  },
683
684
  { deep: true, immediate: true }
684
685
  );
685
686
  watch(
686
687
  fileList,
687
688
  (files) => {
688
- if (isSyncingFiles) return;
689
+ if (!files.length && !reModelValue.value.length) return;
689
690
  emit("update:files", files);
690
691
  updateTempModelValue(files);
691
692
  },
@@ -694,9 +695,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
694
695
  watch(
695
696
  reModelValue,
696
697
  async (newVal, oldVal) => {
697
- ossListAbort?.abort?.(ossListAbortReason);
698
- ossListAbort = void 0;
699
- if (hasFilesProp && props.files.length || isSyncingUploadModelValue) return;
698
+ const isInternalSync = oldVal !== void 0 && checkSameObject(newVal, internalModelValue);
699
+ if (hasFilesProp && props.files.length || isInternalSync) {
700
+ return;
701
+ }
700
702
  const reNewVal = newVal.filter((item) => !isTempModelValue(item));
701
703
  const reOldVal = oldVal?.filter((item) => !isTempModelValue(item));
702
704
  if (!newVal.length) {
@@ -704,6 +706,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
704
706
  return;
705
707
  }
706
708
  if (!reNewVal.length || checkSameObject(reNewVal, reOldVal)) return;
709
+ ossListAbort?.abort?.(ossListAbortReason);
710
+ ossListAbort = void 0;
707
711
  const { valueMode } = reProps.value;
708
712
  const apiFn = valueMode === "url" ? getOssByUrls : getOssByIds;
709
713
  const currentRequest = abortWrapper(apiFn(reNewVal));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "qidian-vue-ui",
3
- "version": "2.8.3",
3
+ "version": "2.8.4",
4
4
  "description": "基于 TDesign 的 QiDian Vue UI 组件库",
5
5
  "author": "qidian",
6
6
  "license": "MIT",