@tekkare/auriga 0.1.126 → 0.1.127
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/argFooter.vue +1 -1
- package/dist/runtime/components/argLangSelect.vue +3 -3
- package/dist/runtime/components/argMultipleChoice.vue +58 -13
- package/dist/runtime/components/argMultipleChoice.vue.d.ts +2 -2
- package/dist/runtime/components/argSidebar.vue +8 -4
- package/dist/runtime/components/argSteplineChart.vue +37 -15
- package/dist/runtime/components/argSteplineChart.vue.d.ts +20 -0
- package/package.json +1 -1
package/dist/module.json
CHANGED
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
</div>
|
|
21
21
|
<arg-icon
|
|
22
22
|
v-if="sidebarOpen !== false"
|
|
23
|
-
name="CaretDown"
|
|
23
|
+
:name="sidebarOpen !== null ? 'CaretRight' : 'CaretDown'"
|
|
24
24
|
size="14"
|
|
25
25
|
class="lang_choice_icon flex-20"
|
|
26
26
|
:class="showLangOptions ? 'icon-rotate' : ''"
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
@click="selectLang(lang)"
|
|
41
41
|
>
|
|
42
42
|
<arg-flag :iso="lang.iso" height="18" emoji />
|
|
43
|
-
<p
|
|
43
|
+
<p>
|
|
44
44
|
{{ lang.title }}
|
|
45
45
|
</p>
|
|
46
46
|
</div>
|
|
@@ -118,5 +118,5 @@ export default defineComponent({
|
|
|
118
118
|
</script>
|
|
119
119
|
|
|
120
120
|
<style scoped>
|
|
121
|
-
.justify-between{justify-content:space-between}.width-100{width:100%}.language_container{border:none;border-radius:4px;cursor:pointer;display:flex;flex-direction:column;padding:8px;position:relative;transition:max-height .3s ease,background-color .3s linear,overflow .3s linear;z-index:99}.language_container.close{background-color:transparent;max-height:42px;overflow:hidden}.language_container.open{max-height:100px;overflow:visible}.language_container.open,.language_container.open.in-sidebar:hover,.language_container:not(.in-sidebar):hover{background:#fdfdff}.language_container.open{box-shadow:5px 5px 5px rgba(62,63,94,.06)}.language_container.in-sidebar:hover{background:var(--light)}.language_container:hover svg{color:var(--primary)!important}.lang_choice_container{background-color:#fdfdff;border-top:none!important;border:none;border-radius:4px;
|
|
121
|
+
.justify-between{justify-content:space-between}.width-100{width:100%}.language_container{border:none;border-radius:4px;cursor:pointer;display:flex;flex-direction:column;padding:8px;position:relative;transition:max-height .3s ease,background-color .3s linear,overflow .3s linear;z-index:99}.language_container.in-sidebar.open{border-bottom-right-radius:0!important;border-top-right-radius:0!important}.language_container.close{background-color:transparent;max-height:42px;overflow:hidden}.language_container.open{max-height:100px;overflow:visible}.language_container.open,.language_container.open.in-sidebar:hover,.language_container:not(.in-sidebar):hover{background:#fdfdff}.language_container.open{box-shadow:5px 5px 5px rgba(62,63,94,.06)}.language_container.in-sidebar:hover{background:var(--light)}.language_container:hover svg{color:var(--primary)!important}.lang_choice_container{background-color:#fdfdff;border-top:none!important;border:none;border-radius:4px;box-shadow:5px 5px 5px rgba(62,63,94,.06);display:flex;flex-direction:column;gap:4px;padding:8px 12px 10px 8px;position:absolute;transition:max-height .3s linear,max-width .3s linear,opacity .3s ease}.lang_choice_container.in-sidebar{left:100%;top:50%;transform:translateY(-50%)}.lang_choice_container:not(.in-sidebar){border-top-left-radius:0!important;border-top-right-radius:0!important;left:0;right:0;top:32px}.lang_choice_container.in-sidebar.open{max-width:1000px;opacity:1}.lang_choice_container.in-sidebar.close{max-width:0;opacity:0}.lang_choice_container.open:not(.in-sidebar){max-height:100px;opacity:1}.lang_choice_container.close:not(.in-sidebar){max-height:0;opacity:0}.active_lang .lang_choice_container{border-top:none!important}.lang_choice:hover{color:var(--primary)!important}.lang_choice_icon{flex-shrink:0;transition:transform .3s}.icon-rotate{transform:rotate(-180deg)}p{font-size:14px;font-style:normal;font-weight:400;line-height:160%;white-space:nowrap}.lang-choice:hover p{color:var(--primary)!important}
|
|
122
122
|
</style>
|
|
@@ -7,13 +7,13 @@
|
|
|
7
7
|
v-for="(option, index) in element_table"
|
|
8
8
|
:key="index"
|
|
9
9
|
:style="
|
|
10
|
-
nbCols > 1
|
|
10
|
+
nbCols > 1 && dir === 'row'
|
|
11
11
|
? `flex-basis: calc(${Math.round(100 / nbCols)}% - ${Math.round(
|
|
12
12
|
16 / nbCols
|
|
13
13
|
)}px)`
|
|
14
14
|
: ``
|
|
15
15
|
"
|
|
16
|
-
class="oip_row v-center
|
|
16
|
+
class="oip_row v-center cursor-pointer gap-8"
|
|
17
17
|
:class="
|
|
18
18
|
isSelected(index, option)
|
|
19
19
|
? 'selected_option'
|
|
@@ -23,12 +23,15 @@
|
|
|
23
23
|
"
|
|
24
24
|
@click="updateSelection(index, option)"
|
|
25
25
|
>
|
|
26
|
-
<
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
26
|
+
<div class="oip_row v-center gap-4">
|
|
27
|
+
<arg-icon
|
|
28
|
+
:name="getIcon(index, option)"
|
|
29
|
+
:color="getColor(index, option)"
|
|
30
|
+
size="20"
|
|
31
|
+
/>
|
|
32
|
+
<p class="option-value">{{ option }}</p>
|
|
33
|
+
</div>
|
|
34
|
+
<slot :name="option" />
|
|
32
35
|
</div>
|
|
33
36
|
</div>
|
|
34
37
|
</template>
|
|
@@ -39,6 +42,7 @@ import {
|
|
|
39
42
|
onMounted,
|
|
40
43
|
ref,
|
|
41
44
|
computed,
|
|
45
|
+
watch,
|
|
42
46
|
defineComponent
|
|
43
47
|
} from "vue";
|
|
44
48
|
export default defineComponent({
|
|
@@ -72,10 +76,8 @@ export default defineComponent({
|
|
|
72
76
|
},
|
|
73
77
|
emits: ["changeElement", "update:Selection"],
|
|
74
78
|
setup(props, { emit }) {
|
|
75
|
-
const
|
|
76
|
-
const
|
|
77
|
-
const selectedInts = ref(intArray);
|
|
78
|
-
const selectedString = ref(stringArray);
|
|
79
|
+
const selectedInts = ref([]);
|
|
80
|
+
const selectedString = ref([]);
|
|
79
81
|
const getMaxHeight = computed(() => {
|
|
80
82
|
return `${Math.round(
|
|
81
83
|
(props.element_table.length * 23 + (props.element_table.length + 2) * 16) / props.nbCols
|
|
@@ -108,6 +110,49 @@ export default defineComponent({
|
|
|
108
110
|
selectedInts.value = [...new Set(selectedInts.value)];
|
|
109
111
|
selectedString.value = [...new Set(selectedString.value)];
|
|
110
112
|
});
|
|
113
|
+
watch(
|
|
114
|
+
() => props.default_select,
|
|
115
|
+
() => {
|
|
116
|
+
if (props.default_select.length === 0) {
|
|
117
|
+
if (props.must_select.length > 0) {
|
|
118
|
+
if (props.return_value) {
|
|
119
|
+
selectedString.value = props.must_select.map(
|
|
120
|
+
(a) => props.element_table[a]
|
|
121
|
+
);
|
|
122
|
+
} else
|
|
123
|
+
selectedInts.value = props.must_select;
|
|
124
|
+
console.log(selectedString.value);
|
|
125
|
+
} else {
|
|
126
|
+
selectedInts.value = [];
|
|
127
|
+
selectedString.value = [];
|
|
128
|
+
}
|
|
129
|
+
} else {
|
|
130
|
+
const defaultSelect = ref(props.default_select);
|
|
131
|
+
for (let i = 0; i < defaultSelect.value.length; i++) {
|
|
132
|
+
if (props.return_value) {
|
|
133
|
+
selectedString.value.push(
|
|
134
|
+
props.element_table[props.default_select[i]]
|
|
135
|
+
);
|
|
136
|
+
} else {
|
|
137
|
+
selectedInts.value.push(props.default_select[i]);
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
if (props.must_select.length > 0) {
|
|
141
|
+
for (let i = 0; i < props.must_select.length; i++) {
|
|
142
|
+
if (props.return_value) {
|
|
143
|
+
selectedString.value.push(
|
|
144
|
+
props.element_table[props.must_select[i]]
|
|
145
|
+
);
|
|
146
|
+
} else {
|
|
147
|
+
selectedInts.value.push(props.must_select[i]);
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
selectedInts.value = [...new Set(selectedInts.value)];
|
|
152
|
+
selectedString.value = [...new Set(selectedString.value)];
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
);
|
|
111
156
|
function isSelected(index, option) {
|
|
112
157
|
if (selectedInts.value?.includes(index) && !props.must_select.includes(index) || selectedString.value?.includes(option) && !props.must_select.includes(index)) {
|
|
113
158
|
return true;
|
|
@@ -172,5 +217,5 @@ export default defineComponent({
|
|
|
172
217
|
</script>
|
|
173
218
|
|
|
174
219
|
<style scoped>
|
|
175
|
-
.option-value{font-size:14px;font-weight:400;line-height:160%}.multiple-choice-row{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;gap:16px}.multiple-choice-column{align-items:flex-start;display:flex;flex-direction:column;flex-wrap:wrap;gap:16px}.multiple_option:hover svg{color:var(--primary)!important}.selected_option:hover svg{color:var(--primary-hover)!important}.disabled_option{color:var(--dark)!important}.selected_option p{font-weight:500}.cursor-pointer{cursor:pointer}
|
|
220
|
+
.option-value{font-size:14px;font-weight:400;line-height:160%}.multiple-choice-row{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;gap:16px}.multiple-choice-column{align-items:flex-start;display:flex;flex-direction:column;flex-wrap:wrap;gap:16px}.j-between{justify-content:space-between}.multiple_option:hover svg{color:var(--primary)!important}.selected_option:hover svg{color:var(--primary-hover)!important}.disabled_option{color:var(--dark)!important}.selected_option p{font-weight:500}.cursor-pointer{cursor:pointer}
|
|
176
221
|
</style>
|
|
@@ -54,8 +54,8 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
54
54
|
getColor: (index: number, option: string) => "var(--primary)" | "var(--medium)";
|
|
55
55
|
getIcon: (index: number, option: string) => "CheckSquareFill" | "CheckSquareDisable" | "Square";
|
|
56
56
|
isSelected: (index: number, option: string) => boolean;
|
|
57
|
-
selectedInts: import("vue").Ref<
|
|
58
|
-
selectedString: import("vue").Ref<
|
|
57
|
+
selectedInts: import("vue").Ref<any>;
|
|
58
|
+
selectedString: import("vue").Ref<any>;
|
|
59
59
|
getMaxHeight: import("vue").ComputedRef<string>;
|
|
60
60
|
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("changeElement" | "update:Selection")[], "changeElement" | "update:Selection", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
61
61
|
element_table: {
|
|
@@ -6,9 +6,13 @@
|
|
|
6
6
|
id="arg-sidebar"
|
|
7
7
|
>
|
|
8
8
|
<div
|
|
9
|
-
:class="
|
|
10
|
-
sidebarOpen
|
|
11
|
-
|
|
9
|
+
:class="[
|
|
10
|
+
sidebarOpen
|
|
11
|
+
? homeLink !== null
|
|
12
|
+
? 'arg_sidebar_header_full center'
|
|
13
|
+
: 'arg_sidebar_header_full end'
|
|
14
|
+
: 'arg_sidebar_header_small',
|
|
15
|
+
]"
|
|
12
16
|
>
|
|
13
17
|
<nuxt-link
|
|
14
18
|
v-if="homeLink !== null"
|
|
@@ -125,5 +129,5 @@ export default defineComponent({
|
|
|
125
129
|
});
|
|
126
130
|
</script>
|
|
127
131
|
<style scoped>
|
|
128
|
-
.arg_sidebar{align-items:flex-start;background:var(--lightest);border-right:1px solid var(--light,#ececf2);box-sizing:border-box;display:flex;flex-direction:column;gap:16px;height:100vh;left:0;padding:16px 8px;position:fixed;top:0;transition:all .3s ease;width:54px;z-index:98}.arg_sidebar_open{width:200px}.arg_sidebar_header_full{align-items:center;align-self:stretch;display:flex;justify-content:space-between}.arg_sidebar_header_small{align-items:center;display:flex;flex-direction:column;gap:var(--xxs,4px)}.arg_sidebar_home{background:var(--transparent);border-radius:4px;color:var(--primary);font-size:14px;font-weight:400;gap:6px;height:32px;line-height:160%;padding:6px}.arg_sidebar_home,.arg_sidebar_title{align-items:center;display:flex;font-style:normal}.arg_sidebar_title{align-self:stretch;flex-direction:row;font-size:20px;font-weight:900;gap:8px;line-height:normal;margin-bottom:16px;padding:0 8px}.arg_sidebar_body{display:flex;flex-direction:column;gap:16px;height:100%;justify-content:space-between;width:100%}.arg_sidebar_content{display:flex;flex-direction:column;gap:8px}.sidebar_toggle{align-items:center;background:transparent;border-radius:4px;cursor:pointer;display:flex;justify-content:center;padding:6px}.link_menu_tooltip_icon{flex:1 1 100%}.tooltip_display{display:flex!important}.arg_sidebar_home:hover,.sidebar_toggle:hover{background:var(--light,#ececf2)!important}
|
|
132
|
+
.arg_sidebar{align-items:flex-start;background:var(--lightest);border-right:1px solid var(--light,#ececf2);box-sizing:border-box;display:flex;flex-direction:column;gap:16px;height:100vh;left:0;padding:16px 8px;position:fixed;top:0;transition:all .3s ease;width:54px;z-index:98}.arg_sidebar_open{width:200px}.arg_sidebar_header_full{align-items:center;align-self:stretch;display:flex}.arg_sidebar_header_full.center{display:flex;justify-content:space-between}.arg_sidebar_header_full.end{display:flex;justify-content:flex-end}.arg_sidebar_header_small{align-items:center;display:flex;flex-direction:column;gap:var(--xxs,4px)}.arg_sidebar_home{background:var(--transparent);border-radius:4px;color:var(--primary);font-size:14px;font-weight:400;gap:6px;height:32px;line-height:160%;padding:6px}.arg_sidebar_home,.arg_sidebar_title{align-items:center;display:flex;font-style:normal}.arg_sidebar_title{align-self:stretch;flex-direction:row;font-size:20px;font-weight:900;gap:8px;line-height:normal;margin-bottom:16px;padding:0 8px}.arg_sidebar_body{display:flex;flex-direction:column;gap:16px;height:100%;justify-content:space-between;width:100%}.arg_sidebar_content{display:flex;flex-direction:column;gap:8px}.sidebar_toggle{align-items:center;align-self:flex-end;background:transparent;border-radius:4px;cursor:pointer;display:flex;justify-content:center;padding:6px}.link_menu_tooltip_icon{flex:1 1 100%}.tooltip_display{display:flex!important}.arg_sidebar_home:hover,.sidebar_toggle:hover{background:var(--light,#ececf2)!important}
|
|
129
133
|
</style>
|
|
@@ -89,6 +89,17 @@ export default defineComponent({
|
|
|
89
89
|
formatDate: {
|
|
90
90
|
type: Boolean,
|
|
91
91
|
default: true
|
|
92
|
+
},
|
|
93
|
+
dataType: {
|
|
94
|
+
type: String,
|
|
95
|
+
default: null,
|
|
96
|
+
validator: (value) => {
|
|
97
|
+
return [null, "percentage", "price"].includes(value);
|
|
98
|
+
}
|
|
99
|
+
},
|
|
100
|
+
currency: {
|
|
101
|
+
type: String,
|
|
102
|
+
default: null
|
|
92
103
|
}
|
|
93
104
|
},
|
|
94
105
|
setup(props) {
|
|
@@ -156,9 +167,6 @@ export default defineComponent({
|
|
|
156
167
|
width: 2,
|
|
157
168
|
curve: "stepline"
|
|
158
169
|
};
|
|
159
|
-
options.value["dataLabels"] = {
|
|
160
|
-
enabled: false
|
|
161
|
-
};
|
|
162
170
|
if (props.small) {
|
|
163
171
|
options.value["legend"] = {
|
|
164
172
|
show: false,
|
|
@@ -174,8 +182,12 @@ export default defineComponent({
|
|
|
174
182
|
show: false
|
|
175
183
|
}
|
|
176
184
|
};
|
|
185
|
+
options.value["dataLabels"] = {
|
|
186
|
+
enabled: false
|
|
187
|
+
};
|
|
177
188
|
options.value["yaxis"] = {
|
|
178
189
|
floating: true,
|
|
190
|
+
min: 0,
|
|
179
191
|
labels: {
|
|
180
192
|
show: false
|
|
181
193
|
},
|
|
@@ -219,6 +231,24 @@ export default defineComponent({
|
|
|
219
231
|
},
|
|
220
232
|
itemMargin: { vertical: 8, horizontal: 8 }
|
|
221
233
|
};
|
|
234
|
+
options.value["dataLabels"] = {
|
|
235
|
+
enabled: true,
|
|
236
|
+
style: {
|
|
237
|
+
fontFamily: "Figtree, sans-serif",
|
|
238
|
+
fontSize: "12px",
|
|
239
|
+
fontWeight: "400"
|
|
240
|
+
},
|
|
241
|
+
background: {
|
|
242
|
+
borderColor: "transparent",
|
|
243
|
+
opacity: 1,
|
|
244
|
+
borderRadius: 2
|
|
245
|
+
},
|
|
246
|
+
formatter: function(value, opt) {
|
|
247
|
+
const numValue = Math.round(value * 10) / 10;
|
|
248
|
+
const returnValue = new Intl.NumberFormat("fr-FR").format(numValue).replace(",", ".");
|
|
249
|
+
return `${returnValue}${props.dataType === "price" ? ` ${props.currency}` : props.dataType === "percentage" ? " %" : ""}`;
|
|
250
|
+
}
|
|
251
|
+
};
|
|
222
252
|
options.value["xaxis"] = {
|
|
223
253
|
categories: props.categories,
|
|
224
254
|
axisTicks: { show: false },
|
|
@@ -249,19 +279,9 @@ export default defineComponent({
|
|
|
249
279
|
},
|
|
250
280
|
tickAmount: props.categories.length
|
|
251
281
|
};
|
|
252
|
-
options.value["markers"] = {
|
|
253
|
-
shape: "circle",
|
|
254
|
-
size: 3,
|
|
255
|
-
colors: props.colors,
|
|
256
|
-
strokeColors: props.colors,
|
|
257
|
-
strokeWidth: 2,
|
|
258
|
-
strokeOpacity: 0.9,
|
|
259
|
-
strokeDashArray: 0,
|
|
260
|
-
fillOpacity: 1,
|
|
261
|
-
showNullDataPoints: true
|
|
262
|
-
};
|
|
263
282
|
options.value["yaxis"] = {
|
|
264
283
|
show: true,
|
|
284
|
+
min: 0,
|
|
265
285
|
axisBorder: {
|
|
266
286
|
show: false
|
|
267
287
|
},
|
|
@@ -287,7 +307,9 @@ export default defineComponent({
|
|
|
287
307
|
options.value["tooltip"] = {
|
|
288
308
|
y: {
|
|
289
309
|
formatter(value) {
|
|
290
|
-
|
|
310
|
+
const numValue = Math.round(value * 10) / 10;
|
|
311
|
+
const returnValue = new Intl.NumberFormat("fr-FR").format(numValue).replace(",", ".");
|
|
312
|
+
return `${returnValue}${props.dataType === "price" ? ` ${props.currency}` : props.dataType === "percentage" ? " %" : ""}`;
|
|
291
313
|
}
|
|
292
314
|
},
|
|
293
315
|
shared: false
|
|
@@ -41,6 +41,15 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
41
41
|
type: BooleanConstructor;
|
|
42
42
|
default: boolean;
|
|
43
43
|
};
|
|
44
|
+
dataType: {
|
|
45
|
+
type: StringConstructor;
|
|
46
|
+
default: null;
|
|
47
|
+
validator: (value: string | null) => boolean;
|
|
48
|
+
};
|
|
49
|
+
currency: {
|
|
50
|
+
type: StringConstructor;
|
|
51
|
+
default: null;
|
|
52
|
+
};
|
|
44
53
|
}, {
|
|
45
54
|
percentage: (partialValue: number, totalValue: number) => number;
|
|
46
55
|
chartKey: import("vue").Ref<number>;
|
|
@@ -89,6 +98,15 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
89
98
|
type: BooleanConstructor;
|
|
90
99
|
default: boolean;
|
|
91
100
|
};
|
|
101
|
+
dataType: {
|
|
102
|
+
type: StringConstructor;
|
|
103
|
+
default: null;
|
|
104
|
+
validator: (value: string | null) => boolean;
|
|
105
|
+
};
|
|
106
|
+
currency: {
|
|
107
|
+
type: StringConstructor;
|
|
108
|
+
default: null;
|
|
109
|
+
};
|
|
92
110
|
}>>, {
|
|
93
111
|
options: Record<string, any>;
|
|
94
112
|
width: string;
|
|
@@ -98,5 +116,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
98
116
|
tooltipOptions: Record<string, any>;
|
|
99
117
|
formatDate: boolean;
|
|
100
118
|
small: boolean;
|
|
119
|
+
dataType: string;
|
|
120
|
+
currency: string;
|
|
101
121
|
}, {}>;
|
|
102
122
|
export default _default;
|