@tekkare/auriga 0.2.198 → 0.2.200
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
CHANGED
|
@@ -41,5 +41,5 @@ export default defineComponent({
|
|
|
41
41
|
});
|
|
42
42
|
</script>
|
|
43
43
|
<style scoped>
|
|
44
|
-
.arg_modal_container{align-items:center;background-color:transparent;display:flex;flex-direction:column;height:100vh;justify-content:center;left:0;opacity:0;pointer-events:none;position:fixed;top:0;transition:background-color .35s ease,opacity .35s ease;width:100%}.arg_modal_open{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background-color:rgba(0,0,0,.6);opacity:1;pointer-events:auto;z-index:99}.arg_modal{align-items:flex-start;background:var(--base-white,#fff);border-radius:12px;display:flex;flex-shrink:0;height:100%;opacity:0;transform:scale(.95);transition:transform .35s ease,opacity .35s ease;width:100%}.arg_modal_visible{opacity:1;transform:scale(1)}.arg_modal.row{flex-direction:row;max-height:711px;max-width:1014px}.arg_modal.col{flex-direction:column;max-height:663px;max-width:966px}.arg_modal_open.set-width{padding:0 15%;width:70%}.arg_modal_header{align-items:center;align-self:stretch;border-bottom:1px solid var(--light,#ececf2);display:flex;justify-content:space-between;padding:24px}.arg_modal_body{align-self:stretch;flex:1;overflow-y:auto;padding:24px}.arg_modal_body.no-header.no-footer{overflow-y:visible;padding:
|
|
44
|
+
.arg_modal_container{align-items:center;background-color:transparent;display:flex;flex-direction:column;height:100vh;justify-content:center;left:0;opacity:0;pointer-events:none;position:fixed;top:0;transition:background-color .35s ease,opacity .35s ease;width:100%}.arg_modal_open{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background-color:rgba(0,0,0,.6);opacity:1;pointer-events:auto;z-index:99}.arg_modal{align-items:flex-start;background:var(--base-white,#fff);border-radius:12px;display:flex;flex-shrink:0;height:100%;opacity:0;transform:scale(.95);transition:transform .35s ease,opacity .35s ease;width:100%}.arg_modal_visible{opacity:1;transform:scale(1)}.arg_modal.row{flex-direction:row;max-height:711px;max-width:1014px}.arg_modal.col{flex-direction:column;max-height:663px;max-width:966px}.arg_modal_open.set-width{padding:0 15%;width:70%}.arg_modal_header{align-items:center;align-self:stretch;border-bottom:1px solid var(--light,#ececf2);display:flex;justify-content:space-between;padding:24px}.arg_modal_body{align-self:stretch;flex:1;overflow-y:auto;padding:24px}.arg_modal_body.no-header.no-footer{overflow-y:visible;padding:24px}.arg_modal_footer{align-items:center;align-self:stretch;border-top:1px solid var(--light,#ececf2);display:flex;gap:16px;padding:24px}.arg_modal_close{align-items:center;border-radius:4px;cursor:pointer;display:flex;justify-content:center;padding:6px}.arg_modal_close:hover{background-color:var(--lightest,#f5f5fa)}
|
|
45
45
|
</style>
|
|
@@ -1,62 +1,54 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
<
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
2
|
+
<arg-drawer :open="infoOpen" side="right" :width="620" @on-close="closeInfo()">
|
|
3
|
+
<div class="oip_info_section">
|
|
4
|
+
<div class="oip_info_sidebar">
|
|
5
|
+
<div class="oip_info_close" @click="closeInfo()">
|
|
6
|
+
<arg-icon name="X" size="16" />
|
|
7
|
+
<p>{{ closeLabel }}</p>
|
|
8
|
+
</div>
|
|
9
|
+
<div
|
|
10
|
+
v-for="(item, index) in toolbarArray"
|
|
11
|
+
:key="index"
|
|
12
|
+
class="oip_info_menu"
|
|
13
|
+
:class="trueActiveMenu === item.name ? 'active_info_menu' : ''"
|
|
14
|
+
@click="openMenu(item.name)"
|
|
15
|
+
>
|
|
16
|
+
<div class="oip_row v-center gap-4">
|
|
17
|
+
<arg-icon
|
|
18
|
+
:name="item.icon"
|
|
19
|
+
size="20"
|
|
20
|
+
:color="trueActiveMenu === item.name ? '' : 'var(--dark)'"
|
|
21
|
+
/>
|
|
22
|
+
<p>{{ getLabel(item.name) }}</p>
|
|
23
|
+
</div>
|
|
16
24
|
<div
|
|
17
|
-
v-
|
|
18
|
-
|
|
19
|
-
class="oip_info_menu"
|
|
20
|
-
:class="trueActiveMenu === item.name ? 'active_info_menu' : ''"
|
|
21
|
-
@click="openMenu(item.name)"
|
|
25
|
+
v-if="item.name === 'Sources' && sourceAmount > 0"
|
|
26
|
+
class="arg_source_amount"
|
|
22
27
|
>
|
|
23
|
-
|
|
24
|
-
<arg-icon
|
|
25
|
-
:name="item.icon"
|
|
26
|
-
size="20"
|
|
27
|
-
:color="trueActiveMenu === item.name ? '' : 'var(--dark)'"
|
|
28
|
-
/>
|
|
29
|
-
<p>{{ getLabel(item.name) }}</p>
|
|
30
|
-
</div>
|
|
31
|
-
<div
|
|
32
|
-
v-if="item.name === 'Sources' && sourceAmount > 0"
|
|
33
|
-
class="arg_source_amount"
|
|
34
|
-
>
|
|
35
|
-
{{ sourceAmount }}
|
|
36
|
-
</div>
|
|
37
|
-
<div
|
|
38
|
-
v-if="item.name !== 'Sources' && item?.size && item?.size > 0"
|
|
39
|
-
class="arg_source_amount"
|
|
40
|
-
>
|
|
41
|
-
{{ item?.size }}
|
|
42
|
-
</div>
|
|
28
|
+
{{ sourceAmount }}
|
|
43
29
|
</div>
|
|
44
|
-
</div>
|
|
45
|
-
<div class="oip_info_content">
|
|
46
30
|
<div
|
|
47
|
-
v-
|
|
48
|
-
|
|
49
|
-
:class="[
|
|
50
|
-
'toolbar_menu_content',
|
|
51
|
-
trueActiveMenu === item.name ? '' : 'hide',
|
|
52
|
-
]"
|
|
31
|
+
v-if="item.name !== 'Sources' && item?.size && item?.size > 0"
|
|
32
|
+
class="arg_source_amount"
|
|
53
33
|
>
|
|
54
|
-
|
|
34
|
+
{{ item?.size }}
|
|
55
35
|
</div>
|
|
56
36
|
</div>
|
|
57
37
|
</div>
|
|
58
|
-
|
|
59
|
-
|
|
38
|
+
<div class="oip_info_content">
|
|
39
|
+
<div
|
|
40
|
+
v-for="(item, index) in toolbarArray"
|
|
41
|
+
:key="index"
|
|
42
|
+
:class="[
|
|
43
|
+
'toolbar_menu_content',
|
|
44
|
+
trueActiveMenu === item.name ? '' : 'hide',
|
|
45
|
+
]"
|
|
46
|
+
>
|
|
47
|
+
<slot :name="item.name" />
|
|
48
|
+
</div>
|
|
49
|
+
</div>
|
|
50
|
+
</div>
|
|
51
|
+
</arg-drawer>
|
|
60
52
|
</template>
|
|
61
53
|
|
|
62
54
|
<script>
|
|
@@ -68,9 +60,10 @@ import {
|
|
|
68
60
|
watch
|
|
69
61
|
} from "vue";
|
|
70
62
|
import argIcon from "./argIcon.vue";
|
|
63
|
+
import argDrawer from "./argDrawer.vue";
|
|
71
64
|
export default defineComponent({
|
|
72
65
|
name: "argToolbarContent",
|
|
73
|
-
components: { argIcon },
|
|
66
|
+
components: { argIcon, argDrawer },
|
|
74
67
|
props: {
|
|
75
68
|
toolbarOpen: {
|
|
76
69
|
type: Boolean,
|
|
@@ -104,25 +97,22 @@ export default defineComponent({
|
|
|
104
97
|
setup(props, { emit }) {
|
|
105
98
|
const trueActiveMenu = ref("");
|
|
106
99
|
const infoOpen = ref(false);
|
|
107
|
-
const
|
|
100
|
+
const closeLabel = ref("Close");
|
|
108
101
|
async function setLang() {
|
|
109
102
|
const jsonFiles = import.meta.glob("./locales/*.json");
|
|
110
103
|
for (const path in jsonFiles) {
|
|
111
104
|
if (path.split("/")[2].includes(props.lang)) {
|
|
112
105
|
const json = await jsonFiles[path]();
|
|
113
|
-
|
|
106
|
+
closeLabel.value = json.close;
|
|
114
107
|
}
|
|
115
108
|
}
|
|
116
109
|
}
|
|
117
|
-
onBeforeMount(
|
|
110
|
+
onBeforeMount(() => {
|
|
111
|
+
setLang();
|
|
112
|
+
});
|
|
113
|
+
watch(() => props.lang, () => {
|
|
118
114
|
setLang();
|
|
119
115
|
});
|
|
120
|
-
watch(
|
|
121
|
-
() => props.lang,
|
|
122
|
-
() => {
|
|
123
|
-
setLang();
|
|
124
|
-
}
|
|
125
|
-
);
|
|
126
116
|
watch(
|
|
127
117
|
() => props.toolbarOpen,
|
|
128
118
|
(new_info_open) => {
|
|
@@ -136,29 +126,10 @@ export default defineComponent({
|
|
|
136
126
|
trueActiveMenu.value = new_active_menu;
|
|
137
127
|
}
|
|
138
128
|
);
|
|
139
|
-
watch(
|
|
140
|
-
() => infoOpen.value,
|
|
141
|
-
() => {
|
|
142
|
-
if (infoOpen.value) {
|
|
143
|
-
setTimeout(() => {
|
|
144
|
-
document.addEventListener("click", closeInfo);
|
|
145
|
-
}, 500);
|
|
146
|
-
} else document.removeEventListener("click", closeInfo);
|
|
147
|
-
}
|
|
148
|
-
);
|
|
149
129
|
onMounted(() => {
|
|
150
130
|
trueActiveMenu.value = props.activeMenu;
|
|
151
131
|
infoOpen.value = props.toolbarOpen;
|
|
152
132
|
});
|
|
153
|
-
function toggleBodyOverflow(state) {
|
|
154
|
-
if (typeof window !== "undefined") {
|
|
155
|
-
const body = document.querySelector("html");
|
|
156
|
-
if (body) {
|
|
157
|
-
state ? body.style.setProperty("overflow", "hidden") : body.style.removeProperty("overflow");
|
|
158
|
-
}
|
|
159
|
-
}
|
|
160
|
-
}
|
|
161
|
-
watch(infoOpen, toggleBodyOverflow, { immediate: true });
|
|
162
133
|
function openMenu(item) {
|
|
163
134
|
trueActiveMenu.value = item;
|
|
164
135
|
emit("update:Menu", trueActiveMenu.value);
|
|
@@ -175,7 +146,7 @@ export default defineComponent({
|
|
|
175
146
|
trueActiveMenu,
|
|
176
147
|
openMenu,
|
|
177
148
|
closeInfo,
|
|
178
|
-
|
|
149
|
+
closeLabel,
|
|
179
150
|
getLabel
|
|
180
151
|
};
|
|
181
152
|
}
|
|
@@ -183,5 +154,5 @@ export default defineComponent({
|
|
|
183
154
|
</script>
|
|
184
155
|
|
|
185
156
|
<style scoped>
|
|
186
|
-
.
|
|
157
|
+
.oip_info_menu{align-items:center;align-self:stretch;border-bottom:2px solid transparent;color:var(--dark);cursor:pointer;display:flex;font-size:14px;font-style:normal;font-weight:500;gap:4px;justify-content:space-between;line-height:normal;padding:0 16px 4px}.active_info_menu{border-bottom:2px solid var(--primary-primary,#2176ff)!important;color:var(--darkest)!important}.oip_info_item svg{flex-basis:100%}.oip_info_item:hover{background:rgba(237,237,243,.65)}.oip_info_close{align-items:center;background:var(--lightest,#f5f5fa);border-radius:var(--s,8px);color:var(--dark);cursor:pointer;display:flex;font-size:14px;font-weight:400;gap:6px;line-height:160%;margin:0 16px;padding:6px 12px 6px 8px}.oip_info_close:hover{background:var(--light,#ececf2)}.oip_info_section{align-items:flex-start;display:flex;flex-direction:row;height:100%}.oip_info_sidebar{background:var(--base-demi-fond,#f9f9fa);gap:16px;padding:24px 0;width:160px}.oip_info_content,.oip_info_sidebar{align-items:flex-start;align-self:stretch;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-left:1px solid var(--light,#ececf2);display:flex;flex-direction:column}.oip_info_content{background:var(--base-white,#fff);border-radius:var(--None,0);gap:24px;overflow-y:scroll;padding:24px;width:460px}.oip_info_content::-webkit-scrollbar{height:5px!important;width:5px!important}.oip_info_content::-webkit-scrollbar-thumb{background:var(--medium);border-radius:12px!important}.oip_info_content::-webkit-scrollbar-thumb:hover{background:var(--medium)!important}.hide{display:none}.arg_source_amount{align-items:center;background:var(--system-alert,#ef4444);border-radius:30px;color:var(--white);display:flex;flex-direction:column;font-size:10px;font-style:normal;font-weight:900;height:var(--m,16px);justify-content:center;line-height:normal;width:var(--m,16px)}.toolbar_menu_content{align-self:stretch}
|
|
187
158
|
</style>
|
|
@@ -28,7 +28,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
28
28
|
trueActiveMenu: import("vue").Ref<string, string>;
|
|
29
29
|
openMenu: (item: string) => void;
|
|
30
30
|
closeInfo: () => void;
|
|
31
|
-
|
|
31
|
+
closeLabel: import("vue").Ref<string, string>;
|
|
32
32
|
getLabel: (item: string) => string;
|
|
33
33
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:Menu" | "update:Open")[], "update:Menu" | "update:Open", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
34
34
|
toolbarOpen: {
|
|
@@ -65,5 +65,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
65
65
|
toolbarArray: unknown[];
|
|
66
66
|
}, {}, {
|
|
67
67
|
argIcon: any;
|
|
68
|
+
argDrawer: any;
|
|
68
69
|
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
69
70
|
export default _default;
|