@cmstops/pro-compo 3.9.1 → 3.9.2-alpha.1

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 (29) hide show
  1. package/dist/index.css +39 -4
  2. package/dist/index.min.css +1 -1
  3. package/es/config.js +1 -1
  4. package/es/hooks/useAttachement.js +2 -9
  5. package/es/hooks/usePopper.d.ts +1 -1
  6. package/es/hooks/usePopper.js +3 -3
  7. package/es/index.css +39 -4
  8. package/es/selectResourceModal/__demo__/module/DivWrapper.d.ts +268 -0
  9. package/es/selectResourceModal/__demo__/module/basic.d.ts +299 -0
  10. package/es/selectResourceModal/components/List/ListNormal/Filter.js +169 -86
  11. package/es/selectResourceModal/components/List/ListNormal/index.js +21 -6
  12. package/es/selectResourceModal/hooks/useResponsiveFilter.d.ts +21 -0
  13. package/es/selectResourceModal/hooks/useResponsiveFilter.js +142 -0
  14. package/es/selectResourceModal/scripts/useCompoLf.js +1 -1
  15. package/es/selectResourceModal/style/index.css +39 -4
  16. package/es/selectResourceModal/style/index.less +5 -0
  17. package/es/selectResourceModal/style/list.less +39 -4
  18. package/lib/config.js +1 -1
  19. package/lib/hooks/useAttachement.js +2 -9
  20. package/lib/hooks/usePopper.js +3 -3
  21. package/lib/index.css +39 -4
  22. package/lib/selectResourceModal/components/List/ListNormal/Filter.js +166 -83
  23. package/lib/selectResourceModal/components/List/ListNormal/index.js +20 -5
  24. package/lib/selectResourceModal/hooks/useResponsiveFilter.js +144 -0
  25. package/lib/selectResourceModal/scripts/useCompoLf.js +1 -1
  26. package/lib/selectResourceModal/style/index.css +39 -4
  27. package/lib/selectResourceModal/style/index.less +5 -0
  28. package/lib/selectResourceModal/style/list.less +39 -4
  29. package/package.json +1 -1
@@ -1,7 +1,7 @@
1
1
  import { Placement } from '@popperjs/core';
2
2
  import { Ref } from 'vue';
3
3
  export default function usePopper(pannel: Ref<HTMLElement | undefined>, triggerEl: Ref<HTMLElement | undefined>): {
4
- initPopper: (placement?: Placement) => void;
4
+ initPopper: (placement?: Placement, of?: number[] | undefined) => void;
5
5
  show: () => void;
6
6
  hide: () => void;
7
7
  visible: Ref<boolean, boolean>;
@@ -8,16 +8,16 @@ function usePopper(pannel, triggerEl) {
8
8
  };
9
9
  const show = () => {
10
10
  visible.value = true;
11
- window.onclick = (e) => {
11
+ window.onclick = () => {
12
12
  hide();
13
13
  visible.value = false;
14
14
  window.onclick = null;
15
15
  };
16
16
  };
17
- const initPopper = (placement = "bottom-start") => {
17
+ const initPopper = (placement = "bottom-start", of) => {
18
18
  if (!pannel.value || !triggerEl.value)
19
19
  return;
20
- const offset = [0, 10];
20
+ const offset = of != null ? of : [0, 10];
21
21
  if (window.__POWERED_BY_WUJIE__) {
22
22
  offset[1] = -54;
23
23
  }
package/es/index.css CHANGED
@@ -4534,6 +4534,7 @@
4534
4534
  }
4535
4535
  .resource-list-footer {
4536
4536
  display: flex;
4537
+ flex-wrap: wrap;
4537
4538
  justify-content: space-between;
4538
4539
  padding-bottom: 20px;
4539
4540
  }
@@ -4543,6 +4544,10 @@
4543
4544
  gap: 10px;
4544
4545
  align-items: center;
4545
4546
  justify-content: flex-end;
4547
+ margin-top: 10px;
4548
+ }
4549
+ .resource-list-footer .footer-right .list-selected-wrapper {
4550
+ font-size: 12px;
4546
4551
  }
4547
4552
  .resource-list-content-loading {
4548
4553
  display: flex;
@@ -4554,7 +4559,7 @@
4554
4559
  .resource-list .list-item-grid {
4555
4560
  display: grid;
4556
4561
  grid-gap: 20px;
4557
- grid-template-columns: repeat(5, 1fr);
4562
+ grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
4558
4563
  }
4559
4564
  .resource-list .list-content {
4560
4565
  margin-top: 30px;
@@ -4597,7 +4602,8 @@
4597
4602
  }
4598
4603
  .resource-list .list-filter-wrapper .list-filter-tags {
4599
4604
  display: flex;
4600
- justify-content: space-between;
4605
+ flex-wrap: wrap;
4606
+ gap: 10px;
4601
4607
  margin-top: 10px;
4602
4608
  }
4603
4609
  .resource-list .list-filter-wrapper .list-filter-tags .list-filter-tag {
@@ -4618,16 +4624,41 @@
4618
4624
  justify-content: space-between;
4619
4625
  }
4620
4626
  .resource-list .list-filter-wrapper .list-filter .filter-list {
4627
+ position: relative;
4628
+ /** 给 popup 一个参考 */
4621
4629
  display: flex;
4622
- flex-wrap: wrap;
4623
- gap: 10px;
4624
4630
  }
4625
4631
  .resource-list .list-filter-wrapper .list-filter .filter-list .filter-item {
4626
4632
  width: 100px;
4633
+ margin-right: 10px;
4634
+ }
4635
+ .resource-list .list-filter-wrapper .list-filter .filter-list .arco-trigger-popup {
4636
+ z-index: 100000 !important;
4627
4637
  }
4628
4638
  .resource-list .list-filter-wrapper .list-filter .arco-input-prepend {
4629
4639
  padding: 0;
4630
4640
  }
4641
+ .resource-list .list-filter-wrapper .list-filter .more-btn {
4642
+ position: relative;
4643
+ /** 给 poperjs 一个参考 */
4644
+ }
4645
+ .resource-list .list-filter-wrapper .list-filter .more-btn .filter-pannel {
4646
+ inset: 40px auto auto auto !important;
4647
+ }
4648
+ .resource-list .list-filter-wrapper .filter-extra {
4649
+ display: flex;
4650
+ gap: 10px;
4651
+ }
4652
+ .resource-list .list-filter-wrapper .filter-pannel {
4653
+ z-index: 100000;
4654
+ display: flex;
4655
+ flex-direction: column;
4656
+ gap: 10px;
4657
+ padding: 10px;
4658
+ background-color: #fff;
4659
+ border-radius: 4px;
4660
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
4661
+ }
4631
4662
  .resource-list .title {
4632
4663
  display: flex;
4633
4664
  gap: 8px;
@@ -4641,6 +4672,10 @@
4641
4672
  height: 16px;
4642
4673
  background-color: #4886ff;
4643
4674
  }
4675
+ .resource-select-wrap {
4676
+ width: 100%;
4677
+ height: 100%;
4678
+ }
4644
4679
  .resource-select-modal-body {
4645
4680
  height: 80vh;
4646
4681
  padding: 0;
@@ -0,0 +1,268 @@
1
+ /**
2
+ * @file
3
+ * @title selectResourceModal
4
+ * @memberOf 组件类型,例如:数据输入
5
+ * @description 描述你的组件。
6
+ */
7
+ export declare const DivWrapper: {
8
+ (args: any): {
9
+ components: {
10
+ selectResourceModal: any;
11
+ AButton: {
12
+ new (...args: any[]): {
13
+ $: import("vue").ComponentInternalInstance;
14
+ $data: {};
15
+ $props: Partial<{
16
+ disabled: boolean;
17
+ loading: boolean;
18
+ long: boolean;
19
+ htmlType: string;
20
+ }> & Omit<Readonly<{
21
+ type?: unknown;
22
+ shape?: unknown;
23
+ status?: unknown;
24
+ size?: unknown;
25
+ long?: unknown;
26
+ loading?: unknown;
27
+ disabled?: unknown;
28
+ htmlType?: unknown;
29
+ href?: unknown;
30
+ } & {
31
+ disabled: boolean;
32
+ loading: boolean;
33
+ long: boolean;
34
+ htmlType: string;
35
+ } & {
36
+ size?: "small" | "mini" | "medium" | "large" | undefined;
37
+ type?: "text" | "dashed" | "outline" | "primary" | "secondary" | undefined;
38
+ href?: string | undefined;
39
+ shape?: "circle" | "round" | "square" | undefined;
40
+ status?: "success" | "normal" | "warning" | "danger" | undefined;
41
+ }> & {
42
+ onClick?: ((ev: MouseEvent) => any) | undefined;
43
+ } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "long" | "loading" | "disabled" | "htmlType">;
44
+ $attrs: {
45
+ [x: string]: unknown;
46
+ };
47
+ $refs: {
48
+ [x: string]: unknown;
49
+ };
50
+ $slots: Readonly<{
51
+ [name: string]: import("vue").Slot<any> | undefined;
52
+ }>;
53
+ $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import("vue").ComponentProvideOptions>, {}, {}, "", {}, any> | null;
54
+ $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import("vue").ComponentProvideOptions>, {}, {}, "", {}, any> | null;
55
+ $emit: (event: "click", ev: MouseEvent) => void;
56
+ $el: any;
57
+ $options: import("vue").ComponentOptionsBase<Readonly<{
58
+ type?: unknown;
59
+ shape?: unknown;
60
+ status?: unknown;
61
+ size?: unknown;
62
+ long?: unknown;
63
+ loading?: unknown;
64
+ disabled?: unknown;
65
+ htmlType?: unknown;
66
+ href?: unknown;
67
+ } & {
68
+ disabled: boolean;
69
+ loading: boolean;
70
+ long: boolean;
71
+ htmlType: string;
72
+ } & {
73
+ size?: "small" | "mini" | "medium" | "large" | undefined;
74
+ type?: "text" | "dashed" | "outline" | "primary" | "secondary" | undefined;
75
+ href?: string | undefined;
76
+ shape?: "circle" | "round" | "square" | undefined;
77
+ status?: "success" | "normal" | "warning" | "danger" | undefined;
78
+ }> & {
79
+ onClick?: ((ev: MouseEvent) => any) | undefined;
80
+ }, {
81
+ prefixCls: string;
82
+ cls: import("vue").ComputedRef<(string | {
83
+ [x: string]: boolean;
84
+ })[]>;
85
+ mergedDisabled: import("vue").ComputedRef<boolean>;
86
+ handleClick: (ev: MouseEvent) => void;
87
+ }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
88
+ click: (ev: MouseEvent) => true;
89
+ }, string, {
90
+ disabled: boolean;
91
+ loading: boolean;
92
+ long: boolean;
93
+ htmlType: string;
94
+ }, {}, string, {}, {}, {}, string, import("vue").ComponentProvideOptions> & {
95
+ beforeCreate?: (() => void) | (() => void)[] | undefined;
96
+ created?: (() => void) | (() => void)[] | undefined;
97
+ beforeMount?: (() => void) | (() => void)[] | undefined;
98
+ mounted?: (() => void) | (() => void)[] | undefined;
99
+ beforeUpdate?: (() => void) | (() => void)[] | undefined;
100
+ updated?: (() => void) | (() => void)[] | undefined;
101
+ activated?: (() => void) | (() => void)[] | undefined;
102
+ deactivated?: (() => void) | (() => void)[] | undefined;
103
+ beforeDestroy?: (() => void) | (() => void)[] | undefined;
104
+ beforeUnmount?: (() => void) | (() => void)[] | undefined;
105
+ destroyed?: (() => void) | (() => void)[] | undefined;
106
+ unmounted?: (() => void) | (() => void)[] | undefined;
107
+ renderTracked?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[] | undefined;
108
+ renderTriggered?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[] | undefined;
109
+ errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import("vue").ComponentProvideOptions>, {}, {}, "", {}, any> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, import("vue").ComponentProvideOptions>, {}, {}, "", {}, any> | null, info: string) => boolean | void)[] | undefined;
110
+ };
111
+ $forceUpdate: () => void;
112
+ $nextTick: typeof import("vue").nextTick;
113
+ $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
114
+ } & Readonly<{
115
+ type?: unknown;
116
+ shape?: unknown;
117
+ status?: unknown;
118
+ size?: unknown;
119
+ long?: unknown;
120
+ loading?: unknown;
121
+ disabled?: unknown;
122
+ htmlType?: unknown;
123
+ href?: unknown;
124
+ } & {
125
+ disabled: boolean;
126
+ loading: boolean;
127
+ long: boolean;
128
+ htmlType: string;
129
+ } & {
130
+ size?: "small" | "mini" | "medium" | "large" | undefined;
131
+ type?: "text" | "dashed" | "outline" | "primary" | "secondary" | undefined;
132
+ href?: string | undefined;
133
+ shape?: "circle" | "round" | "square" | undefined;
134
+ status?: "success" | "normal" | "warning" | "danger" | undefined;
135
+ }> & {
136
+ onClick?: ((ev: MouseEvent) => any) | undefined;
137
+ } & import("vue").ShallowUnwrapRef<{
138
+ prefixCls: string;
139
+ cls: import("vue").ComputedRef<(string | {
140
+ [x: string]: boolean;
141
+ })[]>;
142
+ mergedDisabled: import("vue").ComputedRef<boolean>;
143
+ handleClick: (ev: MouseEvent) => void;
144
+ }> & import("vue").ComponentCustomProperties;
145
+ __isFragment?: undefined;
146
+ __isTeleport?: undefined;
147
+ __isSuspense?: undefined;
148
+ } & import("vue").ComponentOptionsBase<Readonly<{
149
+ type?: unknown;
150
+ shape?: unknown;
151
+ status?: unknown;
152
+ size?: unknown;
153
+ long?: unknown;
154
+ loading?: unknown;
155
+ disabled?: unknown;
156
+ htmlType?: unknown;
157
+ href?: unknown;
158
+ } & {
159
+ disabled: boolean;
160
+ loading: boolean;
161
+ long: boolean;
162
+ htmlType: string;
163
+ } & {
164
+ size?: "small" | "mini" | "medium" | "large" | undefined;
165
+ type?: "text" | "dashed" | "outline" | "primary" | "secondary" | undefined;
166
+ href?: string | undefined;
167
+ shape?: "circle" | "round" | "square" | undefined;
168
+ status?: "success" | "normal" | "warning" | "danger" | undefined;
169
+ }> & {
170
+ onClick?: ((ev: MouseEvent) => any) | undefined;
171
+ }, {
172
+ prefixCls: string;
173
+ cls: import("vue").ComputedRef<(string | {
174
+ [x: string]: boolean;
175
+ })[]>;
176
+ mergedDisabled: import("vue").ComputedRef<boolean>;
177
+ handleClick: (ev: MouseEvent) => void;
178
+ }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
179
+ click: (ev: MouseEvent) => true;
180
+ }, string, {
181
+ disabled: boolean;
182
+ loading: boolean;
183
+ long: boolean;
184
+ htmlType: string;
185
+ }, {}, string, {}, {}, {}, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & {
186
+ Group: import("vue").DefineComponent<{
187
+ type: {
188
+ type: import("vue").PropType<"text" | "dashed" | "outline" | "primary" | "secondary">;
189
+ };
190
+ status: {
191
+ type: import("vue").PropType<"success" | "normal" | "warning" | "danger">;
192
+ };
193
+ shape: {
194
+ type: import("vue").PropType<"circle" | "round" | "square">;
195
+ };
196
+ size: {
197
+ type: import("vue").PropType<"small" | "mini" | "medium" | "large">;
198
+ };
199
+ disabled: {
200
+ type: BooleanConstructor;
201
+ };
202
+ }, {
203
+ prefixCls: string;
204
+ }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
205
+ type?: unknown;
206
+ status?: unknown;
207
+ shape?: unknown;
208
+ size?: unknown;
209
+ disabled?: unknown;
210
+ } & {
211
+ disabled: boolean;
212
+ } & {
213
+ size?: "small" | "mini" | "medium" | "large" | undefined;
214
+ type?: "text" | "dashed" | "outline" | "primary" | "secondary" | undefined;
215
+ shape?: "circle" | "round" | "square" | undefined;
216
+ status?: "success" | "normal" | "warning" | "danger" | undefined;
217
+ }>, {
218
+ disabled: boolean;
219
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
220
+ install: (app: import("vue").App<any>, options?: import("@arco-design/web-vue/es/_utils/types").ArcoOptions | undefined) => void;
221
+ };
222
+ };
223
+ setup(): {
224
+ visible: import("vue").Ref<boolean, boolean>;
225
+ submit: (data: any, ...args: any) => void;
226
+ args: any;
227
+ };
228
+ template: string;
229
+ };
230
+ args: {
231
+ wrap: string;
232
+ userInfo: {
233
+ domain_id: number;
234
+ repository_id: number;
235
+ };
236
+ maxcount: number;
237
+ filterOptions: {
238
+ mediaType: string;
239
+ mediaTypeStrict: boolean;
240
+ };
241
+ };
242
+ argTypes: {
243
+ userInfo: {
244
+ description: string;
245
+ control: {
246
+ type: string;
247
+ };
248
+ };
249
+ maxcount: {
250
+ description: string;
251
+ control: {
252
+ type: string;
253
+ };
254
+ };
255
+ filterOptions: {
256
+ description: string;
257
+ control: {
258
+ type: string;
259
+ };
260
+ };
261
+ onSubmit: {
262
+ action: string;
263
+ };
264
+ onUpdateVis: {
265
+ action: string;
266
+ };
267
+ };
268
+ };