@tekkare/auriga 0.1.27 → 0.1.28
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/allIcons.vue +4 -1
- package/dist/runtime/components/argActions.vue +47 -64
- package/dist/runtime/components/argActions.vue.d.ts +2 -16
- package/dist/runtime/components/argAdvancedSearchBar.vue.d.ts +2 -2
- package/dist/runtime/components/argBtn.vue +4 -2
- package/dist/runtime/components/argBtn.vue.d.ts +9 -0
- package/dist/runtime/components/argFileBtn.vue.d.ts +2 -2
- package/dist/runtime/components/argFlag.vue.d.ts +1 -1
- package/dist/runtime/components/argHomeAllBlocks.vue +200 -0
- package/dist/runtime/components/argHomeAllBlocks.vue.d.ts +89 -0
- package/dist/runtime/components/argHomeContent.vue +46 -0
- package/dist/runtime/components/argHomeContent.vue.d.ts +2 -0
- package/dist/runtime/components/argHomeHeader.vue +82 -0
- package/dist/runtime/components/argHomeHeader.vue.d.ts +33 -0
- package/dist/runtime/components/argHomeKpis.vue +73 -0
- package/dist/runtime/components/argHomeKpis.vue.d.ts +38 -0
- package/dist/runtime/components/argHomeLayout.vue +38 -0
- package/dist/runtime/components/argHomeLayout.vue.d.ts +2 -0
- package/dist/runtime/components/argHomeSelectedBlock.vue +94 -0
- package/dist/runtime/components/argHomeSelectedBlock.vue.d.ts +14 -0
- package/dist/runtime/components/argIcon.vue +2 -0
- package/dist/runtime/components/argIcon.vue.d.ts +1 -0
- package/dist/runtime/components/argLangSelect.vue +141 -0
- package/dist/runtime/components/argLangSelect.vue.d.ts +55 -0
- package/dist/runtime/components/argScopeHeader.vue +0 -4
- package/dist/runtime/components/argScopeHeader.vue.d.ts +0 -9
- package/dist/runtime/components/argScopeLayout.vue +2 -28
- package/dist/runtime/components/argScopeLayout.vue.d.ts +1 -13
- package/dist/runtime/components/argStyle.vue +4 -0
- package/dist/runtime/components/argTextBtn.vue +13 -2
- package/dist/runtime/components/argTextBtn.vue.d.ts +9 -0
- package/package.json +1 -1
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="arg_home_header">
|
|
3
|
+
<div>
|
|
4
|
+
<h1 class="home_title">{{ homeTitle }}</h1>
|
|
5
|
+
<p v-if="homeSubtitle" class="home_subtitle">
|
|
6
|
+
{{ homeSubtitle.toUpperCase() }}
|
|
7
|
+
</p>
|
|
8
|
+
</div>
|
|
9
|
+
|
|
10
|
+
<div class="oip_row v-center gap-16">
|
|
11
|
+
<slot name="actions" />
|
|
12
|
+
<arg-menu-link
|
|
13
|
+
:sidebar-open="true"
|
|
14
|
+
to="https://openinnovationprogram.com/"
|
|
15
|
+
label="Back to OIP"
|
|
16
|
+
icon="ArrowSquareOut"
|
|
17
|
+
/>
|
|
18
|
+
</div>
|
|
19
|
+
</div>
|
|
20
|
+
</template>
|
|
21
|
+
|
|
22
|
+
<script>
|
|
23
|
+
import {
|
|
24
|
+
defineComponent
|
|
25
|
+
} from "vue";
|
|
26
|
+
export default defineComponent({
|
|
27
|
+
name: "argHomeHeader",
|
|
28
|
+
props: {
|
|
29
|
+
homeTitle: {
|
|
30
|
+
type: String,
|
|
31
|
+
required: true
|
|
32
|
+
},
|
|
33
|
+
homeSubtitle: {
|
|
34
|
+
type: String,
|
|
35
|
+
default: null
|
|
36
|
+
},
|
|
37
|
+
lang: {
|
|
38
|
+
type: String,
|
|
39
|
+
default: "en",
|
|
40
|
+
validator: (value) => {
|
|
41
|
+
return ["en", "fr"].includes(value);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
});
|
|
46
|
+
</script>
|
|
47
|
+
|
|
48
|
+
<style scoped>
|
|
49
|
+
.arg_home_header {
|
|
50
|
+
display: flex;
|
|
51
|
+
flex-direction: row;
|
|
52
|
+
padding: 10px 24px;
|
|
53
|
+
align-items: center;
|
|
54
|
+
justify-content: space-between;
|
|
55
|
+
gap: var(--m, 16px);
|
|
56
|
+
position: fixed;
|
|
57
|
+
top: 0;
|
|
58
|
+
left: 0;
|
|
59
|
+
align-self: stretch;
|
|
60
|
+
border-bottom: 1px solid var(--base-dividers, #ececf2);
|
|
61
|
+
background: rgba(253, 253, 255, 0.8);
|
|
62
|
+
width: calc(100% - 48px);
|
|
63
|
+
backdrop-filter: blur(12px);
|
|
64
|
+
z-index: 20;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.home_subtitle {
|
|
68
|
+
color: var(--cool-grey, #8487ac);
|
|
69
|
+
font-size: 14px;
|
|
70
|
+
font-style: normal;
|
|
71
|
+
font-weight: 400;
|
|
72
|
+
line-height: normal;
|
|
73
|
+
font-variant: all-small-caps;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.home_title {
|
|
77
|
+
font-size: 20px;
|
|
78
|
+
font-style: normal;
|
|
79
|
+
font-weight: 900;
|
|
80
|
+
line-height: normal;
|
|
81
|
+
}
|
|
82
|
+
</style>
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
declare const _default: import("vue").DefineComponent<{
|
|
2
|
+
homeTitle: {
|
|
3
|
+
type: StringConstructor;
|
|
4
|
+
required: true;
|
|
5
|
+
};
|
|
6
|
+
homeSubtitle: {
|
|
7
|
+
type: StringConstructor;
|
|
8
|
+
default: null;
|
|
9
|
+
};
|
|
10
|
+
lang: {
|
|
11
|
+
type: StringConstructor;
|
|
12
|
+
default: string;
|
|
13
|
+
validator: (value: string) => boolean;
|
|
14
|
+
};
|
|
15
|
+
}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
16
|
+
homeTitle: {
|
|
17
|
+
type: StringConstructor;
|
|
18
|
+
required: true;
|
|
19
|
+
};
|
|
20
|
+
homeSubtitle: {
|
|
21
|
+
type: StringConstructor;
|
|
22
|
+
default: null;
|
|
23
|
+
};
|
|
24
|
+
lang: {
|
|
25
|
+
type: StringConstructor;
|
|
26
|
+
default: string;
|
|
27
|
+
validator: (value: string) => boolean;
|
|
28
|
+
};
|
|
29
|
+
}>>, {
|
|
30
|
+
lang: string;
|
|
31
|
+
homeSubtitle: string;
|
|
32
|
+
}, {}>;
|
|
33
|
+
export default _default;
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="oip_card kpi_card">
|
|
3
|
+
<div v-for="(kpi, index) in kpis" :key="index" class="kpi_item">
|
|
4
|
+
<div class="kpi_icon">
|
|
5
|
+
<arg-icon :name="kpi.icon" color="var(--cool-grey)" size="32" />
|
|
6
|
+
</div>
|
|
7
|
+
<div class="kpi_text">
|
|
8
|
+
<p class="kpi_value">{{ kpi.value }}</p>
|
|
9
|
+
<p class="kpi_legend">{{ kpi.legend }}</p>
|
|
10
|
+
</div>
|
|
11
|
+
</div>
|
|
12
|
+
</div>
|
|
13
|
+
</template>
|
|
14
|
+
<script>
|
|
15
|
+
import {
|
|
16
|
+
defineComponent
|
|
17
|
+
} from "vue";
|
|
18
|
+
import argIcon from "./argIcon.vue";
|
|
19
|
+
export default defineComponent({
|
|
20
|
+
name: "argHomeKpis",
|
|
21
|
+
components: { argIcon },
|
|
22
|
+
props: {
|
|
23
|
+
kpis: {
|
|
24
|
+
type: Array,
|
|
25
|
+
required: true
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
});
|
|
29
|
+
</script>
|
|
30
|
+
|
|
31
|
+
<style scoped>
|
|
32
|
+
.kpi_card {
|
|
33
|
+
display: flex;
|
|
34
|
+
width: calc(100% - 32px);
|
|
35
|
+
padding: 16px !important;
|
|
36
|
+
align-items: center;
|
|
37
|
+
justify-content: space-between;
|
|
38
|
+
gap: 16px;
|
|
39
|
+
}
|
|
40
|
+
.kpi_item {
|
|
41
|
+
display: flex;
|
|
42
|
+
align-items: center;
|
|
43
|
+
gap: var(--m, 16px);
|
|
44
|
+
flex: 1 0 0;
|
|
45
|
+
}
|
|
46
|
+
.kpi_icon {
|
|
47
|
+
display: flex;
|
|
48
|
+
padding: 8px;
|
|
49
|
+
justify-content: center;
|
|
50
|
+
align-items: center;
|
|
51
|
+
background: var(--background);
|
|
52
|
+
border-radius: 8px;
|
|
53
|
+
}
|
|
54
|
+
.kpi_text {
|
|
55
|
+
display: flex;
|
|
56
|
+
flex-direction: column;
|
|
57
|
+
align-items: flex-start;
|
|
58
|
+
gap: 4px;
|
|
59
|
+
}
|
|
60
|
+
.kpi_value {
|
|
61
|
+
font-size: 22px;
|
|
62
|
+
font-style: normal;
|
|
63
|
+
font-weight: 900;
|
|
64
|
+
line-height: normal;
|
|
65
|
+
}
|
|
66
|
+
.kpi_legend {
|
|
67
|
+
font-size: 12px;
|
|
68
|
+
font-style: normal;
|
|
69
|
+
font-weight: 400;
|
|
70
|
+
line-height: normal;
|
|
71
|
+
color: var(--cool-grey);
|
|
72
|
+
}
|
|
73
|
+
</style>
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
declare const _default: import("vue").DefineComponent<{
|
|
2
|
+
kpis: {
|
|
3
|
+
type: {
|
|
4
|
+
(arrayLength: number): Object[];
|
|
5
|
+
(...items: Object[]): Object[];
|
|
6
|
+
new (arrayLength: number): Object[];
|
|
7
|
+
new (...items: Object[]): Object[];
|
|
8
|
+
isArray(arg: any): arg is any[];
|
|
9
|
+
readonly prototype: any[];
|
|
10
|
+
from<T>(arrayLike: ArrayLike<T>): T[];
|
|
11
|
+
from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
|
|
12
|
+
from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
|
|
13
|
+
from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
|
|
14
|
+
of<T_4>(...items: T_4[]): T_4[];
|
|
15
|
+
readonly [Symbol.species]: ArrayConstructor;
|
|
16
|
+
};
|
|
17
|
+
required: true;
|
|
18
|
+
};
|
|
19
|
+
}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
20
|
+
kpis: {
|
|
21
|
+
type: {
|
|
22
|
+
(arrayLength: number): Object[];
|
|
23
|
+
(...items: Object[]): Object[];
|
|
24
|
+
new (arrayLength: number): Object[];
|
|
25
|
+
new (...items: Object[]): Object[];
|
|
26
|
+
isArray(arg: any): arg is any[];
|
|
27
|
+
readonly prototype: any[];
|
|
28
|
+
from<T>(arrayLike: ArrayLike<T>): T[];
|
|
29
|
+
from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
|
|
30
|
+
from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
|
|
31
|
+
from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
|
|
32
|
+
of<T_4>(...items: T_4[]): T_4[];
|
|
33
|
+
readonly [Symbol.species]: ArrayConstructor;
|
|
34
|
+
};
|
|
35
|
+
required: true;
|
|
36
|
+
};
|
|
37
|
+
}>>, {}, {}>;
|
|
38
|
+
export default _default;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<client-only><arg-style /></client-only>
|
|
3
|
+
<div class="arg_main_home">
|
|
4
|
+
<slot name="header" />
|
|
5
|
+
<div class="arg_home_layout_body">
|
|
6
|
+
<slot name="body" />
|
|
7
|
+
</div>
|
|
8
|
+
<argFooter class="full_width_footer" />
|
|
9
|
+
</div>
|
|
10
|
+
</template>
|
|
11
|
+
<script>
|
|
12
|
+
import {
|
|
13
|
+
defineComponent
|
|
14
|
+
} from "vue";
|
|
15
|
+
import argStyle from "./argStyle.vue";
|
|
16
|
+
import argFooter from "./argFooter.vue";
|
|
17
|
+
export default defineComponent({
|
|
18
|
+
name: "argHomeLayout",
|
|
19
|
+
components: { argStyle, argFooter }
|
|
20
|
+
});
|
|
21
|
+
</script>
|
|
22
|
+
<style>
|
|
23
|
+
.arg_main_home {
|
|
24
|
+
display: flex;
|
|
25
|
+
flex-direction: column;
|
|
26
|
+
align-items: center;
|
|
27
|
+
}
|
|
28
|
+
.arg_home_layout_body {
|
|
29
|
+
min-height: calc(100vh - 77px);
|
|
30
|
+
margin: 116px 32px 0px 32px;
|
|
31
|
+
max-width: 1200px;
|
|
32
|
+
width: calc(100% - 64px);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.full_width_footer {
|
|
36
|
+
width: calc(100% - 192px);
|
|
37
|
+
}
|
|
38
|
+
</style>
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
|
|
2
|
+
export default _default;
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="oip_card selected_block_card">
|
|
3
|
+
<div v-if="selected === null" class="selected_block_display">
|
|
4
|
+
<div class="icon_square">
|
|
5
|
+
<arg-icon name="HandPointing" color="var(--cool-grey)" size="32" />
|
|
6
|
+
</div>
|
|
7
|
+
<div class="theme_select_message">
|
|
8
|
+
<p class="theme_title">Select a theme</p>
|
|
9
|
+
<p class="theme_descr">
|
|
10
|
+
Select a theme to display the analyses available within it.
|
|
11
|
+
</p>
|
|
12
|
+
</div>
|
|
13
|
+
</div>
|
|
14
|
+
<div v-else class="selected_block_display">
|
|
15
|
+
<div class="theme_title_display">
|
|
16
|
+
<div class="oip_row v-center gap-8">
|
|
17
|
+
<arg-flag
|
|
18
|
+
v-if="selected.country"
|
|
19
|
+
:slug="selected.country.toLowerCase()"
|
|
20
|
+
height="16"
|
|
21
|
+
/>
|
|
22
|
+
<p class="theme_title">{{ selected.title }}</p>
|
|
23
|
+
</div>
|
|
24
|
+
<p class="theme_descr">{{ selected.description }}</p>
|
|
25
|
+
</div>
|
|
26
|
+
<slot name="links" />
|
|
27
|
+
</div>
|
|
28
|
+
</div>
|
|
29
|
+
</template>
|
|
30
|
+
|
|
31
|
+
<script>
|
|
32
|
+
import {
|
|
33
|
+
defineComponent
|
|
34
|
+
} from "vue";
|
|
35
|
+
import argIcon from "./argIcon.vue";
|
|
36
|
+
export default defineComponent({
|
|
37
|
+
name: "argHomeSelectedBlock",
|
|
38
|
+
components: { argIcon },
|
|
39
|
+
props: {
|
|
40
|
+
selected: {
|
|
41
|
+
type: Object,
|
|
42
|
+
default: null
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
});
|
|
46
|
+
</script>
|
|
47
|
+
|
|
48
|
+
<style scoped>
|
|
49
|
+
.selected_block_card {
|
|
50
|
+
margin: 0px !important;
|
|
51
|
+
position: fixed;
|
|
52
|
+
padding: 24px;
|
|
53
|
+
position: sticky;
|
|
54
|
+
top: 12vh;
|
|
55
|
+
flex: 1;
|
|
56
|
+
height: fit-content;
|
|
57
|
+
}
|
|
58
|
+
.selected_block_display {
|
|
59
|
+
display: flex;
|
|
60
|
+
flex-direction: column;
|
|
61
|
+
gap: 24px;
|
|
62
|
+
}
|
|
63
|
+
.theme_select_message {
|
|
64
|
+
display: flex;
|
|
65
|
+
flex-direction: column;
|
|
66
|
+
gap: 12px;
|
|
67
|
+
}
|
|
68
|
+
.theme_title_display {
|
|
69
|
+
display: flex;
|
|
70
|
+
flex-direction: column;
|
|
71
|
+
gap: 8px;
|
|
72
|
+
}
|
|
73
|
+
.icon_square {
|
|
74
|
+
display: flex;
|
|
75
|
+
align-items: center;
|
|
76
|
+
justify-content: center;
|
|
77
|
+
background: var(--dividers);
|
|
78
|
+
padding: 8px;
|
|
79
|
+
border-radius: 8px;
|
|
80
|
+
width: fit-content;
|
|
81
|
+
}
|
|
82
|
+
.theme_title {
|
|
83
|
+
font-size: 20px;
|
|
84
|
+
font-style: normal;
|
|
85
|
+
font-weight: 900;
|
|
86
|
+
line-height: normal;
|
|
87
|
+
}
|
|
88
|
+
.theme_descr {
|
|
89
|
+
font-size: 14px;
|
|
90
|
+
font-style: normal;
|
|
91
|
+
font-weight: 400;
|
|
92
|
+
line-height: 160%;
|
|
93
|
+
}
|
|
94
|
+
</style>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
declare const _default: import("vue").DefineComponent<{
|
|
2
|
+
selected: {
|
|
3
|
+
type: ObjectConstructor;
|
|
4
|
+
default: null;
|
|
5
|
+
};
|
|
6
|
+
}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
7
|
+
selected: {
|
|
8
|
+
type: ObjectConstructor;
|
|
9
|
+
default: null;
|
|
10
|
+
};
|
|
11
|
+
}>>, {
|
|
12
|
+
selected: Record<string, any>;
|
|
13
|
+
}, {}>;
|
|
14
|
+
export default _default;
|
|
@@ -692,6 +692,7 @@ export default defineComponent({
|
|
|
692
692
|
"MinusSquareFill",
|
|
693
693
|
"MinusSquareDisable",
|
|
694
694
|
"Minus",
|
|
695
|
+
"Molecule",
|
|
695
696
|
"Money",
|
|
696
697
|
"MonitorPlay",
|
|
697
698
|
"Monitor",
|
|
@@ -1753,6 +1754,7 @@ export default defineComponent({
|
|
|
1753
1754
|
MinusSquareFill: '<path d="M208 40H48C43.5817 40 40 43.5817 40 48V208C40 212.418 43.5817 216 48 216H208C212.418 216 216 212.418 216 208V48C216 43.5817 212.418 40 208 40Z" stroke="currentColor" fill="currentColor" stroke-linecap="round" stroke-linejoin="round"/><path d="M96 128H160" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>',
|
|
1754
1755
|
MinusSquareDisable: '<path d="M208 40H48C43.5817 40 40 43.5817 40 48V208C40 212.418 43.5817 216 48 216H208C212.418 216 216 212.418 216 208V48C216 43.5817 212.418 40 208 40Z" stroke="var(--lavendar-grey)" stroke-linecap="round" stroke-linejoin="round" fill="var(--lavendar-grey)"/><path d="M96 128H160" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>',
|
|
1755
1756
|
Minus: '<rect width="256" height="256" fill="none" stroke="none"/><line x1="40" y1="128" x2="216" y2="128" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" />',
|
|
1757
|
+
Molecule: '<path stroke="currentColor" fill="currentColor" stroke-width="4px" d="M64.6,15.2c-21.5,8.6-25.1,37.3-6.3,50.6c5.1,3.6,10.3,5.2,18.3,5.4l6.2,0.1l7.9,14.6l8,14.5l-4.3,4.6c-7.4,7.7-10.3,13.8-12,24.7c-1.2,7.6,0.1,16.2,3.6,23.9l2.6,5.6l-3.8,3.6c-2.1,1.9-9.8,8.8-17,15.4l-13.2,11.8l-3.5-1.7c-7.4-3.8-18.4-3.9-25.5-0.2c-4.5,2.3-10.7,8.7-13.2,13.5c-2.1,3.9-2.5,5.7-2.5,12.3c0,6.7,0.4,8.5,2.5,12.9c2.9,5.9,8.2,11,14.2,13.8c3.2,1.5,5.9,1.9,11.9,1.9c6.7,0,8.4-0.4,12.5-2.5c10.3-5.5,16-14.7,16-25.7c0-4.2-0.5-7.7-1.5-10.1l-1.5-3.6L69,196c2.7-2.5,10.4-9.5,17-15.4c11.4-10.2,12.2-10.8,14-9.7c18,11.4,37.6,10.9,52.8-1l3.4-2.7l2.4,1.8c1.3,1,3.9,3.3,5.9,5l3.5,3.2l-1.3,3.8c-1.8,5-1.7,14,0.1,19.3c1.8,5.6,8.5,12.8,14.4,15.9c4,2.1,5.7,2.5,12.8,2.5c7.1,0,8.8-0.4,12.8-2.5c6.1-3.2,10.8-8.2,13.8-14.7c2.1-4.6,2.4-6.3,2-12.3c-0.5-11.3-6.2-20.1-16-25c-6.2-3-18.8-3-25.1,0.1l-4.3,2.1l-5.9-5.2c-3.3-2.8-5.9-5.3-5.9-5.4c0-0.1,0.9-2.6,2-5.6c1.7-4.5,2.1-7.4,2.1-16.2l0.1-10.8l9.5-4.3c16.6-7.6,14.9-7.2,18.9-3.8c11.6,10.2,27.8,10.1,38.9-0.1c6.7-6.1,9.1-11.8,9.2-21.3c0-5.6-0.5-8.3-2-11.5c-2.7-6-7.8-11.3-13.8-14.2c-4.5-2.2-6.3-2.6-12.9-2.6c-6.2,0-8.6,0.5-12,2.2c-10.1,4.9-16.5,14.9-16.6,25.7l-0.1,6l-12.6,5.6l-12.7,5.6l-5.6-5.7c-11.8-12.2-27.3-16.4-44.4-12c-2.2,0.5-2.7-0.2-10.3-13.9c-4.4-7.9-7.9-14.8-7.9-15.1c0-0.4,1-2,2.3-3.6c5.9-7.7,7.7-18.5,4.6-27.9c-1.9-5.7-8.5-13-14.5-16.1C81.2,13.1,71.1,12.5,64.6,15.2z M82.9,29.7c8.9,5.6,9,18.4,0.1,25c-3.7,2.8-12.7,2.6-16.9-0.3c-7.2-5.2-8.2-15.4-2.2-22.1C69.1,26.6,76.3,25.6,82.9,29.7z M223.2,80.7c15,6.9,10.4,28.3-6.2,28.3c-4.7,0-9.1-2.6-12.3-7.3c-1.8-2.6-2.1-4.1-1.8-8.3c0.5-6.2,3.2-10.4,8.4-12.8C216,78.6,218.6,78.6,223.2,80.7z M136.5,107.2c20.3,7.7,26,33.9,10.7,49.2c-8,8-19,10.8-30.2,7.4c-5.6-1.7-7.4-2.8-11.8-7.2c-3.7-3.7-5.7-6.7-7.2-10.7c-6.1-16.2,3.1-34.5,20-39.7C122.4,104.8,131.5,105.4,136.5,107.2z M201.3,177.6c4.1,2.3,7.7,8.4,7.7,13c0,4.6-3.6,10.5-8.2,12.8c-4.9,2.6-8.6,2.6-13.7,0c-4.6-2.3-8.2-8-8.2-13.2c0-5.6,4.6-12.1,10-14.1C192.2,175,197.9,175.6,201.3,177.6z M46.1,201.3c1.6,1.1,4,3.5,5.2,5.2c1.8,2.6,2.1,4.1,1.8,8.4c-0.5,6.6-3.6,10.8-9.5,13.1c-3.6,1.4-4.7,1.5-8.5,0.5c-5.1-1.4-8-3.8-10.3-9.1c-2.2-4.6-1.6-8.9,1.5-13.8C30.5,199.2,40,197.2,46.1,201.3z"/>',
|
|
1756
1758
|
Money: '<rect width="256" height="256" fill="none" stroke="none"/><rect x="16" y="64" width="224" height="128" rx="8" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" /><circle cx="128" cy="128" r="32" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" /><line x1="176" y1="64" x2="240" y2="120" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" /><line x1="176" y1="192" x2="240" y2="136" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" /><line x1="80" y1="64" x2="16" y2="120" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" /><line x1="80" y1="192" x2="16" y2="136" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" />',
|
|
1757
1759
|
MonitorPlay: '<rect width="256" height="256" fill="none" stroke="none"/><rect x="32" y="48" width="192" height="144" rx="16" transform="translate(256 240) rotate(180)" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" /><line x1="160" y1="224" x2="96" y2="224" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" /><polygon points="160 120 112 88 112 152 160 120" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" />',
|
|
1758
1760
|
Monitor: '<rect width="256" height="256" fill="none" stroke="none"/><rect x="32" y="48" width="192" height="144" rx="16" transform="translate(256 240) rotate(180)" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" /><line x1="160" y1="224" x2="96" y2="224" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" />',
|
|
@@ -0,0 +1,141 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div
|
|
3
|
+
v-if="langs.length > 0"
|
|
4
|
+
class="language_container"
|
|
5
|
+
:class="showLangOptions ? 'active_lang' : ''"
|
|
6
|
+
@click="showLangOptions = !showLangOptions"
|
|
7
|
+
>
|
|
8
|
+
<div class="oip_row v-center gap-8 justify-between">
|
|
9
|
+
<div class="oip_row v-center gap-4">
|
|
10
|
+
<arg-flag :iso="selectedItem.iso" height="16" emoji />
|
|
11
|
+
<p>
|
|
12
|
+
{{ langs.filter((f) => f.iso === selectedItem.iso)[0].title }}
|
|
13
|
+
</p>
|
|
14
|
+
</div>
|
|
15
|
+
<arg-icon
|
|
16
|
+
name="CaretDown"
|
|
17
|
+
size="14"
|
|
18
|
+
class="lang_choice_icon"
|
|
19
|
+
:class="showLangOptions ? 'icon-rotate' : ''"
|
|
20
|
+
/>
|
|
21
|
+
</div>
|
|
22
|
+
<div v-if="showLangOptions" class="lang_choice_container">
|
|
23
|
+
<div
|
|
24
|
+
v-for="(lang, index) in langs.filter((f) => f.iso !== selectedItem.iso)"
|
|
25
|
+
:key="index"
|
|
26
|
+
class="oip_row v-center gap-4 lang-choice"
|
|
27
|
+
@click="selectLang(lang)"
|
|
28
|
+
>
|
|
29
|
+
<arg-flag :iso="lang.iso" height="16" emoji />
|
|
30
|
+
<p>{{ lang.title }}</p>
|
|
31
|
+
</div>
|
|
32
|
+
</div>
|
|
33
|
+
</div>
|
|
34
|
+
</template>
|
|
35
|
+
|
|
36
|
+
<script>
|
|
37
|
+
import {
|
|
38
|
+
onMounted,
|
|
39
|
+
ref,
|
|
40
|
+
defineComponent
|
|
41
|
+
} from "vue";
|
|
42
|
+
import argIcon from "./argIcon.vue";
|
|
43
|
+
import argFlag from "./argFlag.vue";
|
|
44
|
+
export default defineComponent({
|
|
45
|
+
name: "argLangSelect",
|
|
46
|
+
components: { argIcon, argFlag },
|
|
47
|
+
props: {
|
|
48
|
+
langs: {
|
|
49
|
+
type: Array,
|
|
50
|
+
required: true
|
|
51
|
+
},
|
|
52
|
+
default_locale: {
|
|
53
|
+
type: String,
|
|
54
|
+
default: "fr"
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
emits: ["onSelectLang", "update:Lang"],
|
|
58
|
+
setup(props, { emit }) {
|
|
59
|
+
const showLangOptions = ref(false);
|
|
60
|
+
const selectedItem = ref({
|
|
61
|
+
title: "Fran\xE7ais",
|
|
62
|
+
iso: "fr",
|
|
63
|
+
locale: "fr"
|
|
64
|
+
});
|
|
65
|
+
onMounted(() => {
|
|
66
|
+
selectedItem.value = props.langs[props.langs.findIndex((a) => a.locale === props.default_locale)];
|
|
67
|
+
});
|
|
68
|
+
function selectLang(item) {
|
|
69
|
+
selectedItem.value = item;
|
|
70
|
+
emit("onSelectLang", item);
|
|
71
|
+
emit("update:Lang", item.locale);
|
|
72
|
+
}
|
|
73
|
+
return {
|
|
74
|
+
selectedItem,
|
|
75
|
+
showLangOptions,
|
|
76
|
+
selectLang
|
|
77
|
+
};
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
</script>
|
|
81
|
+
|
|
82
|
+
<style scoped>
|
|
83
|
+
.language_container {
|
|
84
|
+
cursor: pointer;
|
|
85
|
+
border: 1.5px solid transparent;
|
|
86
|
+
border-radius: 8px;
|
|
87
|
+
padding: 11px 8px;
|
|
88
|
+
position: relative;
|
|
89
|
+
background: rgba(253, 253, 255, 0.8);
|
|
90
|
+
border: 1.5px solid transparent;
|
|
91
|
+
z-index: 99;
|
|
92
|
+
}
|
|
93
|
+
.language_container:hover svg {
|
|
94
|
+
color: var(--primary) !important;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.lang_choice_container {
|
|
98
|
+
padding: 20px 12px 10px 8px;
|
|
99
|
+
left: -1px;
|
|
100
|
+
position: absolute;
|
|
101
|
+
background: rgba(253, 253, 255, 0.8);
|
|
102
|
+
border-top: none !important;
|
|
103
|
+
border: 1.5px solid transparent;
|
|
104
|
+
border-radius: 8px;
|
|
105
|
+
border-top-left-radius: 0px !important;
|
|
106
|
+
border-top-right-radius: 0px !important;
|
|
107
|
+
width: calc(100% - 20px);
|
|
108
|
+
}
|
|
109
|
+
.lang_choice_container.set-width {
|
|
110
|
+
width: 102% !important;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
.active_lang .lang_choice_container {
|
|
114
|
+
border-top: none !important;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.lang_choice_container:hover {
|
|
118
|
+
color: var(--primary) !important;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
.lang_choice_icon {
|
|
122
|
+
transition: transform 0.3s;
|
|
123
|
+
flex-shrink: 0;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.icon-rotate {
|
|
127
|
+
transform: rotate(-180deg);
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
p {
|
|
131
|
+
font-size: 14px;
|
|
132
|
+
font-style: normal;
|
|
133
|
+
font-weight: 400;
|
|
134
|
+
line-height: 160%;
|
|
135
|
+
white-space: nowrap;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
.lang-choice:hover p {
|
|
139
|
+
color: var(--primary) !important;
|
|
140
|
+
}
|
|
141
|
+
</style>
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
declare const _default: import("vue").DefineComponent<{
|
|
2
|
+
langs: {
|
|
3
|
+
type: {
|
|
4
|
+
(arrayLength: number): Object[];
|
|
5
|
+
(...items: Object[]): Object[];
|
|
6
|
+
new (arrayLength: number): Object[];
|
|
7
|
+
new (...items: Object[]): Object[];
|
|
8
|
+
isArray(arg: any): arg is any[];
|
|
9
|
+
readonly prototype: any[];
|
|
10
|
+
from<T>(arrayLike: ArrayLike<T>): T[];
|
|
11
|
+
from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
|
|
12
|
+
from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
|
|
13
|
+
from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
|
|
14
|
+
of<T_4>(...items: T_4[]): T_4[];
|
|
15
|
+
readonly [Symbol.species]: ArrayConstructor;
|
|
16
|
+
};
|
|
17
|
+
required: true;
|
|
18
|
+
};
|
|
19
|
+
default_locale: {
|
|
20
|
+
type: StringConstructor;
|
|
21
|
+
default: string;
|
|
22
|
+
};
|
|
23
|
+
}, {
|
|
24
|
+
selectedItem: any;
|
|
25
|
+
showLangOptions: import("vue").Ref<boolean>;
|
|
26
|
+
selectLang: (item: any) => void;
|
|
27
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("onSelectLang" | "update:Lang")[], "onSelectLang" | "update:Lang", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
28
|
+
langs: {
|
|
29
|
+
type: {
|
|
30
|
+
(arrayLength: number): Object[];
|
|
31
|
+
(...items: Object[]): Object[];
|
|
32
|
+
new (arrayLength: number): Object[];
|
|
33
|
+
new (...items: Object[]): Object[];
|
|
34
|
+
isArray(arg: any): arg is any[];
|
|
35
|
+
readonly prototype: any[];
|
|
36
|
+
from<T>(arrayLike: ArrayLike<T>): T[];
|
|
37
|
+
from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
|
|
38
|
+
from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
|
|
39
|
+
from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
|
|
40
|
+
of<T_4>(...items: T_4[]): T_4[];
|
|
41
|
+
readonly [Symbol.species]: ArrayConstructor;
|
|
42
|
+
};
|
|
43
|
+
required: true;
|
|
44
|
+
};
|
|
45
|
+
default_locale: {
|
|
46
|
+
type: StringConstructor;
|
|
47
|
+
default: string;
|
|
48
|
+
};
|
|
49
|
+
}>> & {
|
|
50
|
+
onOnSelectLang?: ((...args: any[]) => any) | undefined;
|
|
51
|
+
"onUpdate:Lang"?: ((...args: any[]) => any) | undefined;
|
|
52
|
+
}, {
|
|
53
|
+
default_locale: string;
|
|
54
|
+
}, {}>;
|
|
55
|
+
export default _default;
|
|
@@ -3,10 +3,6 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
3
3
|
type: StringConstructor;
|
|
4
4
|
default: string;
|
|
5
5
|
};
|
|
6
|
-
noSelection: {
|
|
7
|
-
type: BooleanConstructor;
|
|
8
|
-
default: boolean;
|
|
9
|
-
};
|
|
10
6
|
lang: {
|
|
11
7
|
type: StringConstructor;
|
|
12
8
|
default: string;
|
|
@@ -20,10 +16,6 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
20
16
|
type: StringConstructor;
|
|
21
17
|
default: string;
|
|
22
18
|
};
|
|
23
|
-
noSelection: {
|
|
24
|
-
type: BooleanConstructor;
|
|
25
|
-
default: boolean;
|
|
26
|
-
};
|
|
27
19
|
lang: {
|
|
28
20
|
type: StringConstructor;
|
|
29
21
|
default: string;
|
|
@@ -32,6 +24,5 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
32
24
|
}>>, {
|
|
33
25
|
lang: string;
|
|
34
26
|
scopeTitle: string;
|
|
35
|
-
noSelection: boolean;
|
|
36
27
|
}, {}>;
|
|
37
28
|
export default _default;
|