@tekkare/auriga 0.1.23 → 0.1.24
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/module.json +1 -1
- package/dist/runtime/components/argComplexSelect.vue +3 -5
- package/dist/runtime/components/argDropdownSelect.vue +17 -11
- package/dist/runtime/components/argDropdownSelect.vue.d.ts +9 -0
- package/dist/runtime/components/argMainLayout.vue +1 -1
- package/dist/runtime/components/argMultipleSelect.vue +193 -186
- package/dist/runtime/components/argMultipleSelect.vue.d.ts +9 -0
- package/dist/runtime/components/argSimpleLabel.vue +0 -4
- package/package.json +1 -1
package/dist/module.json
CHANGED
|
@@ -350,7 +350,7 @@ export default defineComponent({
|
|
|
350
350
|
if (isDisplay.value === true) {
|
|
351
351
|
setTimeout(() => {
|
|
352
352
|
document?.addEventListener("click", close);
|
|
353
|
-
},
|
|
353
|
+
}, 100);
|
|
354
354
|
}
|
|
355
355
|
const elem = document?.getElementById("select_complex");
|
|
356
356
|
const simpleElem = document?.getElementById("simple_select_complex");
|
|
@@ -363,10 +363,8 @@ export default defineComponent({
|
|
|
363
363
|
}
|
|
364
364
|
}
|
|
365
365
|
function close() {
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
document?.removeEventListener("click", close);
|
|
369
|
-
}
|
|
366
|
+
isDisplay.value = false;
|
|
367
|
+
document?.removeEventListener("click", close);
|
|
370
368
|
}
|
|
371
369
|
function add_element(element) {
|
|
372
370
|
smart_selection_selected.value = void 0;
|
|
@@ -57,11 +57,12 @@
|
|
|
57
57
|
/>
|
|
58
58
|
</div>
|
|
59
59
|
<!-- List -->
|
|
60
|
-
<
|
|
60
|
+
<arg-data-loader v-if="loading" />
|
|
61
|
+
<div v-else class="oip_select_dropdown_selection_container">
|
|
61
62
|
<div
|
|
62
|
-
class="oip_select_complex_selection_loop"
|
|
63
63
|
v-for="(element, index) of filterName()"
|
|
64
64
|
:key="index"
|
|
65
|
+
class="oip_select_complex_selection_loop"
|
|
65
66
|
:class="values_disabled.includes(index) ? 'disabled_option' : ''"
|
|
66
67
|
@click="add_element(element, index)"
|
|
67
68
|
>
|
|
@@ -127,6 +128,7 @@
|
|
|
127
128
|
import argIcon from "./argIcon.vue";
|
|
128
129
|
import argTooltip from "./argTooltip.vue";
|
|
129
130
|
import argSimpleLabel from "./argSimpleLabel.vue";
|
|
131
|
+
import argDataLoader from "./argDataLoader.vue";
|
|
130
132
|
import {
|
|
131
133
|
onMounted,
|
|
132
134
|
ref,
|
|
@@ -137,7 +139,7 @@ import {
|
|
|
137
139
|
} from "vue";
|
|
138
140
|
export default defineComponent({
|
|
139
141
|
name: "argDropdownSelect",
|
|
140
|
-
components: { argIcon, argTooltip, argSimpleLabel },
|
|
142
|
+
components: { argIcon, argTooltip, argSimpleLabel, argDataLoader },
|
|
141
143
|
props: {
|
|
142
144
|
element_table: { type: Array, required: true },
|
|
143
145
|
search: { type: Boolean, default: true },
|
|
@@ -153,7 +155,8 @@ export default defineComponent({
|
|
|
153
155
|
return_value: { type: Boolean, default: false },
|
|
154
156
|
values_disabled: { type: Array, default: () => [] },
|
|
155
157
|
empty_msg: { type: String, default: "No selection" },
|
|
156
|
-
dropdown_label: { type: String, required: true }
|
|
158
|
+
dropdown_label: { type: String, required: true },
|
|
159
|
+
loading: { type: Boolean, default: false }
|
|
157
160
|
},
|
|
158
161
|
emits: ["changeElement", "update:Selection", "changeInputValue"],
|
|
159
162
|
setup(props, { emit }) {
|
|
@@ -161,9 +164,14 @@ export default defineComponent({
|
|
|
161
164
|
const searchName = ref("");
|
|
162
165
|
const labelElement = ref();
|
|
163
166
|
const isEllipsisActive = ref(false);
|
|
164
|
-
const table_values = ref(
|
|
165
|
-
const selected_item =
|
|
166
|
-
const selected_number =
|
|
167
|
+
const table_values = ref([]);
|
|
168
|
+
const selected_item = ref(null);
|
|
169
|
+
const selected_number = ref(null);
|
|
170
|
+
onMounted(() => {
|
|
171
|
+
table_values.value = props.element_table;
|
|
172
|
+
selected_item.value = props.default_select ? props.element_table[props.default_select] : null;
|
|
173
|
+
selected_number.value = props.default_select ? props.default_select : null;
|
|
174
|
+
});
|
|
167
175
|
watch(
|
|
168
176
|
() => props.element_table,
|
|
169
177
|
(new_element_table) => {
|
|
@@ -214,10 +222,8 @@ export default defineComponent({
|
|
|
214
222
|
}
|
|
215
223
|
}
|
|
216
224
|
function closeDropdown() {
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
document?.removeEventListener("click", closeDropdown);
|
|
220
|
-
}
|
|
225
|
+
isDisplay.value = false;
|
|
226
|
+
document?.removeEventListener("click", closeDropdown);
|
|
221
227
|
}
|
|
222
228
|
function filterName() {
|
|
223
229
|
if (searchName.value !== null) {
|
|
@@ -58,6 +58,10 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
58
58
|
type: StringConstructor;
|
|
59
59
|
required: true;
|
|
60
60
|
};
|
|
61
|
+
loading: {
|
|
62
|
+
type: BooleanConstructor;
|
|
63
|
+
default: boolean;
|
|
64
|
+
};
|
|
61
65
|
}, {
|
|
62
66
|
isDisplay: import("vue").Ref<boolean>;
|
|
63
67
|
searchName: import("vue").Ref<string>;
|
|
@@ -132,11 +136,16 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
132
136
|
type: StringConstructor;
|
|
133
137
|
required: true;
|
|
134
138
|
};
|
|
139
|
+
loading: {
|
|
140
|
+
type: BooleanConstructor;
|
|
141
|
+
default: boolean;
|
|
142
|
+
};
|
|
135
143
|
}>> & {
|
|
136
144
|
onChangeElement?: ((...args: any[]) => any) | undefined;
|
|
137
145
|
"onUpdate:Selection"?: ((...args: any[]) => any) | undefined;
|
|
138
146
|
onChangeInputValue?: ((...args: any[]) => any) | undefined;
|
|
139
147
|
}, {
|
|
148
|
+
loading: boolean;
|
|
140
149
|
return_value: boolean;
|
|
141
150
|
disabled: boolean;
|
|
142
151
|
empty_msg: string;
|
|
@@ -36,74 +36,117 @@
|
|
|
36
36
|
>
|
|
37
37
|
<!--<div v-if="filter_placeholder" class="oip_select_multiple_title">{{ filter_placeholder }}</div>-->
|
|
38
38
|
<div v-if="search === true" class="oip_search_container">
|
|
39
|
-
<arg-icon size="20" name="MagnifyingGlass"
|
|
39
|
+
<arg-icon size="20" name="MagnifyingGlass" />
|
|
40
40
|
<input
|
|
41
|
-
class="oip_search_name"
|
|
42
41
|
v-model="searchName"
|
|
43
|
-
|
|
42
|
+
class="oip_search_name"
|
|
44
43
|
placeholder="Search"
|
|
44
|
+
@input="changeInput()"
|
|
45
45
|
/>
|
|
46
46
|
</div>
|
|
47
|
-
|
|
48
|
-
<div v-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
: add_all()
|
|
56
|
-
"
|
|
57
|
-
>
|
|
58
|
-
<arg-icon
|
|
59
|
-
:class="
|
|
60
|
-
!selected_all && getOptions.length !== selected_items.length
|
|
61
|
-
? 'del'
|
|
62
|
-
: 'add'
|
|
63
|
-
"
|
|
64
|
-
thickness="24"
|
|
65
|
-
size="16px"
|
|
66
|
-
:name="
|
|
47
|
+
<arg-data-loader v-if="loading" />
|
|
48
|
+
<div v-else>
|
|
49
|
+
<!-- List -->
|
|
50
|
+
<div v-if="!nested" class="oip_select_dropdown_selection_container">
|
|
51
|
+
<div
|
|
52
|
+
v-if="show_all"
|
|
53
|
+
class="oip_select_complex_selection_loop"
|
|
54
|
+
@click="
|
|
67
55
|
selected_all || getOptions.length === selected_items.length
|
|
68
|
-
?
|
|
69
|
-
:
|
|
56
|
+
? del_all()
|
|
57
|
+
: add_all()
|
|
70
58
|
"
|
|
71
|
-
/>
|
|
72
|
-
<div
|
|
73
|
-
:class="[
|
|
74
|
-
'oip_select_complex_selection_loop_name',
|
|
75
|
-
!selected_all && getOptions.length !== selected_items.length
|
|
76
|
-
? 'del'
|
|
77
|
-
: 'add',
|
|
78
|
-
]"
|
|
79
59
|
>
|
|
80
|
-
|
|
60
|
+
<arg-icon
|
|
61
|
+
:class="
|
|
62
|
+
!selected_all && getOptions.length !== selected_items.length
|
|
63
|
+
? 'del'
|
|
64
|
+
: 'add'
|
|
65
|
+
"
|
|
66
|
+
thickness="24"
|
|
67
|
+
size="16px"
|
|
68
|
+
:name="
|
|
69
|
+
selected_all || getOptions.length === selected_items.length
|
|
70
|
+
? 'CheckSquareFill'
|
|
71
|
+
: 'Square'
|
|
72
|
+
"
|
|
73
|
+
/>
|
|
74
|
+
<div
|
|
75
|
+
:class="[
|
|
76
|
+
'oip_select_complex_selection_loop_name',
|
|
77
|
+
!selected_all && getOptions.length !== selected_items.length
|
|
78
|
+
? 'del'
|
|
79
|
+
: 'add',
|
|
80
|
+
]"
|
|
81
|
+
>
|
|
82
|
+
All
|
|
83
|
+
</div>
|
|
81
84
|
</div>
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
85
|
+
<div :class="show_all ? 'oip_select_multiple_left_margin' : ''">
|
|
86
|
+
<div v-if="multiple_columns" class="oip_row v-start gap-16">
|
|
87
|
+
<div v-for="(table, tabIndex) of filterName" :key="tabIndex">
|
|
88
|
+
<div
|
|
89
|
+
v-for="(element, index) of table"
|
|
90
|
+
:key="index"
|
|
91
|
+
class="oip_select_complex_selection_loop multiple"
|
|
92
|
+
:class="
|
|
93
|
+
options_disable.includes(index + tabIndex * 7)
|
|
94
|
+
? 'disabled'
|
|
95
|
+
: ''
|
|
96
|
+
"
|
|
97
|
+
@click="
|
|
98
|
+
selected_items.includes(element)
|
|
99
|
+
? del_element(element, index + tabIndex * 7)
|
|
100
|
+
: add_element(element, index + tabIndex * 7)
|
|
101
|
+
"
|
|
102
|
+
>
|
|
103
|
+
<arg-icon
|
|
104
|
+
v-if="
|
|
105
|
+
tabIndex === 0
|
|
106
|
+
? options_disable.includes(index)
|
|
107
|
+
: options_disable.includes(index + tabIndex * 7)
|
|
108
|
+
"
|
|
109
|
+
name="MinusSquareDisable"
|
|
110
|
+
size="16"
|
|
111
|
+
color="var(--independence)"
|
|
112
|
+
class="disable"
|
|
113
|
+
/>
|
|
114
|
+
<arg-icon
|
|
115
|
+
v-else
|
|
116
|
+
:class="selected_items.includes(element) ? 'add' : ''"
|
|
117
|
+
size="16px"
|
|
118
|
+
thickness="24"
|
|
119
|
+
:name="
|
|
120
|
+
selected_items.includes(element)
|
|
121
|
+
? 'CheckSquareFill'
|
|
122
|
+
: 'Square'
|
|
123
|
+
"
|
|
124
|
+
/>
|
|
125
|
+
<div
|
|
126
|
+
:class="[
|
|
127
|
+
'oip_select_complex_selection_loop_name',
|
|
128
|
+
selected_items.includes(element) ? 'add' : 'del',
|
|
129
|
+
]"
|
|
130
|
+
>
|
|
131
|
+
{{ element }}
|
|
132
|
+
</div>
|
|
133
|
+
</div>
|
|
134
|
+
</div>
|
|
135
|
+
</div>
|
|
136
|
+
<div v-else>
|
|
86
137
|
<div
|
|
87
|
-
v-for="(element, index) of
|
|
138
|
+
v-for="(element, index) of filterName"
|
|
88
139
|
:key="index"
|
|
89
140
|
class="oip_select_complex_selection_loop multiple"
|
|
90
|
-
:class="
|
|
91
|
-
options_disable.includes(index + tabIndex * 7)
|
|
92
|
-
? 'disabled'
|
|
93
|
-
: ''
|
|
94
|
-
"
|
|
141
|
+
:class="options_disable.includes(index) ? 'disabled' : ''"
|
|
95
142
|
@click="
|
|
96
143
|
selected_items.includes(element)
|
|
97
|
-
? del_element(element, index
|
|
98
|
-
: add_element(element, index
|
|
144
|
+
? del_element(element, index)
|
|
145
|
+
: add_element(element, index)
|
|
99
146
|
"
|
|
100
147
|
>
|
|
101
148
|
<arg-icon
|
|
102
|
-
v-if="
|
|
103
|
-
tabIndex === 0
|
|
104
|
-
? options_disable.includes(index)
|
|
105
|
-
: options_disable.includes(index + tabIndex * 7)
|
|
106
|
-
"
|
|
149
|
+
v-if="options_disable.includes(index)"
|
|
107
150
|
name="MinusSquareDisable"
|
|
108
151
|
size="16"
|
|
109
152
|
color="var(--independence)"
|
|
@@ -124,6 +167,7 @@
|
|
|
124
167
|
:class="[
|
|
125
168
|
'oip_select_complex_selection_loop_name',
|
|
126
169
|
selected_items.includes(element) ? 'add' : 'del',
|
|
170
|
+
options_disable.includes(index) ? 'disabled' : '',
|
|
127
171
|
]"
|
|
128
172
|
>
|
|
129
173
|
{{ element }}
|
|
@@ -131,156 +175,119 @@
|
|
|
131
175
|
</div>
|
|
132
176
|
</div>
|
|
133
177
|
</div>
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
178
|
+
</div>
|
|
179
|
+
<div v-else class="oip_select_dropdown_selection_container">
|
|
180
|
+
<div
|
|
181
|
+
v-if="show_all"
|
|
182
|
+
class="oip_select_complex_selection_loop"
|
|
183
|
+
@click="
|
|
184
|
+
selected_all || getOptions.length === nestedSelectedLength
|
|
185
|
+
? del_all()
|
|
186
|
+
: add_all()
|
|
187
|
+
"
|
|
188
|
+
>
|
|
189
|
+
<arg-icon
|
|
190
|
+
:class="
|
|
191
|
+
!selected_all && getOptions.length !== nestedSelectedLength
|
|
192
|
+
? 'del'
|
|
193
|
+
: selected_all || getOptions.length === nestedSelectedLength
|
|
194
|
+
? 'add'
|
|
195
|
+
: 'more'
|
|
196
|
+
"
|
|
197
|
+
thickness="24"
|
|
198
|
+
size="16px"
|
|
199
|
+
:name="
|
|
200
|
+
selected_all || getOptions.length === nestedSelectedLength
|
|
201
|
+
? 'CheckSquareFill'
|
|
202
|
+
: 'Square'
|
|
144
203
|
"
|
|
204
|
+
/>
|
|
205
|
+
<div
|
|
206
|
+
:class="[
|
|
207
|
+
'oip_select_complex_selection_loop_name',
|
|
208
|
+
!selected_all && getOptions.length !== nestedSelectedLength
|
|
209
|
+
? 'del'
|
|
210
|
+
: selected_all || getOptions.length === nestedSelectedLength
|
|
211
|
+
? 'add'
|
|
212
|
+
: 'more',
|
|
213
|
+
]"
|
|
145
214
|
>
|
|
146
|
-
|
|
147
|
-
v-if="options_disable.includes(index)"
|
|
148
|
-
name="MinusSquareDisable"
|
|
149
|
-
size="16"
|
|
150
|
-
color="var(--independence)"
|
|
151
|
-
class="disable"
|
|
152
|
-
/>
|
|
153
|
-
<arg-icon
|
|
154
|
-
v-else
|
|
155
|
-
:class="selected_items.includes(element) ? 'add' : ''"
|
|
156
|
-
size="16px"
|
|
157
|
-
thickness="24"
|
|
158
|
-
:name="
|
|
159
|
-
selected_items.includes(element)
|
|
160
|
-
? 'CheckSquareFill'
|
|
161
|
-
: 'Square'
|
|
162
|
-
"
|
|
163
|
-
/>
|
|
164
|
-
<div
|
|
165
|
-
:class="[
|
|
166
|
-
'oip_select_complex_selection_loop_name',
|
|
167
|
-
selected_items.includes(element) ? 'add' : 'del',
|
|
168
|
-
options_disable.includes(index) ? 'disabled' : '',
|
|
169
|
-
]"
|
|
170
|
-
>
|
|
171
|
-
{{ element }}
|
|
172
|
-
</div>
|
|
215
|
+
All
|
|
173
216
|
</div>
|
|
174
217
|
</div>
|
|
175
|
-
</div>
|
|
176
|
-
</div>
|
|
177
|
-
<div v-else class="oip_select_dropdown_selection_container">
|
|
178
|
-
<div
|
|
179
|
-
v-if="show_all"
|
|
180
|
-
class="oip_select_complex_selection_loop"
|
|
181
|
-
@click="
|
|
182
|
-
selected_all || getOptions.length === nestedSelectedLength
|
|
183
|
-
? del_all()
|
|
184
|
-
: add_all()
|
|
185
|
-
"
|
|
186
|
-
>
|
|
187
|
-
<arg-icon
|
|
188
|
-
:class="
|
|
189
|
-
!selected_all && getOptions.length !== nestedSelectedLength
|
|
190
|
-
? 'del'
|
|
191
|
-
: selected_all || getOptions.length === nestedSelectedLength
|
|
192
|
-
? 'add'
|
|
193
|
-
: 'more'
|
|
194
|
-
"
|
|
195
|
-
thickness="24"
|
|
196
|
-
size="16px"
|
|
197
|
-
:name="
|
|
198
|
-
selected_all || getOptions.length === nestedSelectedLength
|
|
199
|
-
? 'CheckSquareFill'
|
|
200
|
-
: 'Square'
|
|
201
|
-
"
|
|
202
|
-
/>
|
|
203
218
|
<div
|
|
204
219
|
:class="[
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
? 'add'
|
|
210
|
-
: 'more',
|
|
220
|
+
show_all
|
|
221
|
+
? 'oip_select_multiple_left_margin cate_left_margin'
|
|
222
|
+
: '',
|
|
223
|
+
multiple_columns ? 'cate_row' : 'cate_col',
|
|
211
224
|
]"
|
|
212
225
|
>
|
|
213
|
-
|
|
214
|
-
</div>
|
|
215
|
-
</div>
|
|
216
|
-
<div
|
|
217
|
-
:class="[
|
|
218
|
-
show_all ? 'oip_select_multiple_left_margin cate_left_margin' : '',
|
|
219
|
-
multiple_columns ? 'cate_row' : 'cate_col',
|
|
220
|
-
]"
|
|
221
|
-
>
|
|
222
|
-
<div v-for="(element, index) of filterNested" :key="index">
|
|
223
|
-
<div
|
|
224
|
-
class="oip_select_complex_selection_loop"
|
|
225
|
-
@click="
|
|
226
|
-
selectedCats.includes(index)
|
|
227
|
-
? del_all_cat(index)
|
|
228
|
-
: add_all_cat(index)
|
|
229
|
-
"
|
|
230
|
-
>
|
|
231
|
-
<arg-icon
|
|
232
|
-
:class="
|
|
233
|
-
!selectedCats.includes(index)
|
|
234
|
-
? 'del'
|
|
235
|
-
: selectedCats.includes(index)
|
|
236
|
-
? 'add'
|
|
237
|
-
: 'more'
|
|
238
|
-
"
|
|
239
|
-
thickness="24"
|
|
240
|
-
size="16px"
|
|
241
|
-
:name="
|
|
242
|
-
selectedCats.includes(index) ? 'CheckSquareFill' : 'Square'
|
|
243
|
-
"
|
|
244
|
-
/>
|
|
226
|
+
<div v-for="(element, index) of filterNested" :key="index">
|
|
245
227
|
<div
|
|
246
|
-
|
|
247
|
-
'oip_select_complex_selection_loop_name',
|
|
248
|
-
!selectedCats.includes(index)
|
|
249
|
-
? 'del'
|
|
250
|
-
: selectedCats.includes(index)
|
|
251
|
-
? 'add'
|
|
252
|
-
: 'more',
|
|
253
|
-
]"
|
|
254
|
-
>
|
|
255
|
-
{{ element.title }}
|
|
256
|
-
</div>
|
|
257
|
-
</div>
|
|
258
|
-
<div class="left_margin">
|
|
259
|
-
<div
|
|
260
|
-
v-for="(option, optIndex) of element.values"
|
|
261
|
-
:key="optIndex"
|
|
262
|
-
class="oip_select_complex_selection_loop multiple"
|
|
228
|
+
class="oip_select_complex_selection_loop"
|
|
263
229
|
@click="
|
|
264
|
-
|
|
265
|
-
?
|
|
266
|
-
:
|
|
230
|
+
selectedCats.includes(index)
|
|
231
|
+
? del_all_cat(index)
|
|
232
|
+
: add_all_cat(index)
|
|
267
233
|
"
|
|
268
234
|
>
|
|
269
235
|
<arg-icon
|
|
270
|
-
:class="
|
|
271
|
-
|
|
236
|
+
:class="
|
|
237
|
+
!selectedCats.includes(index)
|
|
238
|
+
? 'del'
|
|
239
|
+
: selectedCats.includes(index)
|
|
240
|
+
? 'add'
|
|
241
|
+
: 'more'
|
|
242
|
+
"
|
|
272
243
|
thickness="24"
|
|
244
|
+
size="16px"
|
|
273
245
|
:name="
|
|
274
|
-
|
|
246
|
+
selectedCats.includes(index) ? 'CheckSquareFill' : 'Square'
|
|
275
247
|
"
|
|
276
248
|
/>
|
|
277
249
|
<div
|
|
278
250
|
:class="[
|
|
279
251
|
'oip_select_complex_selection_loop_name',
|
|
280
|
-
|
|
252
|
+
!selectedCats.includes(index)
|
|
253
|
+
? 'del'
|
|
254
|
+
: selectedCats.includes(index)
|
|
255
|
+
? 'add'
|
|
256
|
+
: 'more',
|
|
281
257
|
]"
|
|
282
258
|
>
|
|
283
|
-
{{
|
|
259
|
+
{{ element.title }}
|
|
260
|
+
</div>
|
|
261
|
+
</div>
|
|
262
|
+
<div class="left_margin">
|
|
263
|
+
<div
|
|
264
|
+
v-for="(option, optIndex) of element.values"
|
|
265
|
+
:key="optIndex"
|
|
266
|
+
class="oip_select_complex_selection_loop multiple"
|
|
267
|
+
@click="
|
|
268
|
+
nestedIncludes(option, index)
|
|
269
|
+
? del_nested_element(index, option)
|
|
270
|
+
: add_nested_element(index, option)
|
|
271
|
+
"
|
|
272
|
+
>
|
|
273
|
+
<arg-icon
|
|
274
|
+
:class="nestedIncludes(option, index) ? 'add' : ''"
|
|
275
|
+
size="16px"
|
|
276
|
+
thickness="24"
|
|
277
|
+
:name="
|
|
278
|
+
nestedIncludes(option, index)
|
|
279
|
+
? 'CheckSquareFill'
|
|
280
|
+
: 'Square'
|
|
281
|
+
"
|
|
282
|
+
/>
|
|
283
|
+
<div
|
|
284
|
+
:class="[
|
|
285
|
+
'oip_select_complex_selection_loop_name',
|
|
286
|
+
nestedIncludes(option, index) ? 'add' : 'del',
|
|
287
|
+
]"
|
|
288
|
+
>
|
|
289
|
+
{{ option }}
|
|
290
|
+
</div>
|
|
284
291
|
</div>
|
|
285
292
|
</div>
|
|
286
293
|
</div>
|
|
@@ -293,6 +300,7 @@
|
|
|
293
300
|
<script>
|
|
294
301
|
import argIcon from "./argIcon.vue";
|
|
295
302
|
import argSimpleLabel from "./argSimpleLabel.vue";
|
|
303
|
+
import argDataLoader from "./argDataLoader.vue";
|
|
296
304
|
import {
|
|
297
305
|
onMounted,
|
|
298
306
|
ref,
|
|
@@ -303,7 +311,7 @@ import {
|
|
|
303
311
|
} from "vue";
|
|
304
312
|
export default defineComponent({
|
|
305
313
|
name: "argMultipleSelect",
|
|
306
|
-
components: { argIcon, argSimpleLabel },
|
|
314
|
+
components: { argIcon, argSimpleLabel, argDataLoader },
|
|
307
315
|
props: {
|
|
308
316
|
element_table: { type: Array, required: true },
|
|
309
317
|
nested: { type: Boolean, default: false },
|
|
@@ -317,7 +325,8 @@ export default defineComponent({
|
|
|
317
325
|
options_disable: { type: Array, default: () => [] },
|
|
318
326
|
show_amount: { type: Boolean, default: true },
|
|
319
327
|
emptyMsg: { type: String, default: "No selection" },
|
|
320
|
-
multiple_label: { type: String, required: true }
|
|
328
|
+
multiple_label: { type: String, required: true },
|
|
329
|
+
loading: { type: Boolean, default: false }
|
|
321
330
|
},
|
|
322
331
|
emits: ["changeElement", "update:Selection", "changeInputValue", "onClose"],
|
|
323
332
|
setup(props, { emit }) {
|
|
@@ -501,11 +510,9 @@ export default defineComponent({
|
|
|
501
510
|
}
|
|
502
511
|
}
|
|
503
512
|
function close() {
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
document.removeEventListener("click", close);
|
|
508
|
-
}
|
|
513
|
+
emit("onClose");
|
|
514
|
+
isDisplay.value = false;
|
|
515
|
+
document.removeEventListener("click", close);
|
|
509
516
|
}
|
|
510
517
|
function add_element(element, index) {
|
|
511
518
|
if (!props.options_disable.includes(index)) {
|
|
@@ -78,6 +78,10 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
78
78
|
type: StringConstructor;
|
|
79
79
|
required: true;
|
|
80
80
|
};
|
|
81
|
+
loading: {
|
|
82
|
+
type: BooleanConstructor;
|
|
83
|
+
default: boolean;
|
|
84
|
+
};
|
|
81
85
|
}, {
|
|
82
86
|
del_all: () => void;
|
|
83
87
|
del_all_cat: (index: number) => void;
|
|
@@ -186,12 +190,17 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
186
190
|
type: StringConstructor;
|
|
187
191
|
required: true;
|
|
188
192
|
};
|
|
193
|
+
loading: {
|
|
194
|
+
type: BooleanConstructor;
|
|
195
|
+
default: boolean;
|
|
196
|
+
};
|
|
189
197
|
}>> & {
|
|
190
198
|
onOnClose?: ((...args: any[]) => any) | undefined;
|
|
191
199
|
onChangeElement?: ((...args: any[]) => any) | undefined;
|
|
192
200
|
"onUpdate:Selection"?: ((...args: any[]) => any) | undefined;
|
|
193
201
|
onChangeInputValue?: ((...args: any[]) => any) | undefined;
|
|
194
202
|
}, {
|
|
203
|
+
loading: boolean;
|
|
195
204
|
disabled: boolean;
|
|
196
205
|
show_amount: boolean;
|
|
197
206
|
search: boolean;
|
|
@@ -212,10 +212,6 @@ export default defineComponent({
|
|
|
212
212
|
min-height: 10px;
|
|
213
213
|
}
|
|
214
214
|
|
|
215
|
-
.oip_select_dropdown_selection_container:only-child {
|
|
216
|
-
margin-top: 0px;
|
|
217
|
-
}
|
|
218
|
-
|
|
219
215
|
.oip_select_complex_selection_loop > svg.add {
|
|
220
216
|
fill: var(--accent) !important;
|
|
221
217
|
color: var(--pure-white) !important;
|