@timus-networks/theme 1.0.29 → 1.0.31
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/README.md +1 -1
- package/components-js/ThemeAvatar.vue +1 -1
- package/components-js/ThemeBadge.vue +19 -0
- package/components-js/ThemeLink.vue +95 -97
- package/components-js/ThemeSidebar.vue +280 -0
- package/components-js/TimusSamples.vue +35 -34
- package/components-ts/ThemeAvatar.vue +1 -1
- package/components-ts/ThemeBadge.vue +19 -0
- package/components-ts/ThemeLink.vue +95 -97
- package/components-ts/ThemeSidebar.vue +280 -0
- package/components-ts/TimusSamples.vue +35 -34
- package/output/main.css +1 -1
- package/package.json +40 -40
package/README.md
CHANGED
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
|
|
25
25
|
<section>
|
|
26
26
|
<h1>Types</h1>
|
|
27
|
-
<p class="p-md-c my-6">
|
|
27
|
+
<p class="p-md-c my-6">You can use any 'string' expression within the tag, in addition to a type that accepts 'src' or 'icon' as a property.</p>
|
|
28
28
|
<div class="grid grid-flow-col auto-cols-max gap-4 items-center">
|
|
29
29
|
<el-avatar icon="isax-add-circle"></el-avatar>
|
|
30
30
|
<el-avatar icon="isax-add-circle" size="xlarge"></el-avatar>
|
|
@@ -32,6 +32,24 @@
|
|
|
32
32
|
</div>
|
|
33
33
|
</section>
|
|
34
34
|
|
|
35
|
+
<section>
|
|
36
|
+
<h1>Point</h1>
|
|
37
|
+
<p class="p-md-c my-6">Use a red dot to mark content that needs to be noticed.</p>
|
|
38
|
+
<div class="grid grid-flow-col auto-cols-max gap-4">
|
|
39
|
+
<el-badge is-dot class="item">query</el-badge>
|
|
40
|
+
<el-badge is-dot class="item">
|
|
41
|
+
<el-button class="share-button" icon="el-icon-share" type="primary"></el-button>
|
|
42
|
+
</el-badge>
|
|
43
|
+
<el-badge is-dot class="item" v-for="size in sizeList" :key="size + ''"><el-avatar :size="size">SK</el-avatar></el-badge>
|
|
44
|
+
<el-badge is-dot class="item" v-for="size in sizeList" :key="size + ''"><el-avatar shape="square" :size="size">SK</el-avatar></el-badge>
|
|
45
|
+
</div>
|
|
46
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
47
|
+
<p class="text-xs">
|
|
48
|
+
<code><el-badge :value="12"> <el-button size="small">Comments</el-button> </el-badge></code>
|
|
49
|
+
</p>
|
|
50
|
+
</div>
|
|
51
|
+
</section>
|
|
52
|
+
|
|
35
53
|
<section>
|
|
36
54
|
<h1>Max Değer</h1>
|
|
37
55
|
<p class="p-md-c my-6">
|
|
@@ -63,6 +81,7 @@ export default Vue.extend({
|
|
|
63
81
|
data() {
|
|
64
82
|
return {
|
|
65
83
|
colors: ['primary', 'secondary', 'gray', 'info', 'success', 'warning', 'danger'],
|
|
84
|
+
sizeList: ['xlarge', 'large', 'medium', 'small', 'xsmall'],
|
|
66
85
|
};
|
|
67
86
|
},
|
|
68
87
|
methods: {
|
|
@@ -1,111 +1,109 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
2
|
+
<div class="pt-8 pb-16 flex gap-12 flex-col">
|
|
3
|
+
<section>
|
|
4
|
+
<h1>Link</h1>
|
|
5
|
+
<p class="p-lg my-6">
|
|
6
|
+
`el-link` bileşeni, sayfadaki metni veya bağlantıyı temsil eder ve stil ve davranışlarını özelleştirmenize olanak tanır.
|
|
7
|
+
</p>
|
|
8
|
+
<div class="grid grid-flow-col auto-cols-max gap-4">
|
|
9
|
+
<el-link href="https://element.eleme.io" target="_blank">default</el-link>
|
|
10
|
+
<el-link :type="item" v-for="(item, index) in colors" :key="index">{{ item }}</el-link>
|
|
11
|
+
</div>
|
|
12
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
13
|
+
<p class="text-xs">
|
|
14
|
+
<code><el-link type="primary">Bağlantı</el-link></code>
|
|
15
|
+
</p>
|
|
16
|
+
</div>
|
|
17
|
+
</section>
|
|
18
18
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
</div>
|
|
32
|
-
</section>
|
|
19
|
+
<section>
|
|
20
|
+
<h1>Nuxt Link ile Kullanım</h1>
|
|
21
|
+
<p class="p-lg my-6">El Link bileşenini Nuxt Link ile kullanabilirsiniz. Bu, Nuxt.js projelerinde sayfa geçişlerini kolaylaştırır.</p>
|
|
22
|
+
<div class="grid grid-flow-col auto-cols-max gap-4">
|
|
23
|
+
<NuxtLink to="/" v-for="(item, index) in colors" :key="index" :class="`el-link ${item}`"> Router: {{ item }} </NuxtLink>
|
|
24
|
+
</div>
|
|
25
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
26
|
+
<p class="text-xs">
|
|
27
|
+
<code><NuxtLink to="/" class="el-link primary">Link</NuxtLink></code>
|
|
28
|
+
</p>
|
|
29
|
+
</div>
|
|
30
|
+
</section>
|
|
33
31
|
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
32
|
+
<section>
|
|
33
|
+
<h1>Devre Dışı Bırakılmış Durum</h1>
|
|
34
|
+
<p class="p-lg my-6">El Link bileşenini devre dışı bırakmak için <code>disabled</code> özelliğini kullanabilirsiniz.</p>
|
|
35
|
+
<div class="grid grid-flow-col auto-cols-max gap-4">
|
|
36
|
+
<el-link disabled>default</el-link>
|
|
37
|
+
<el-link :type="item" v-for="(item, index) in colors" :key="index" disabled>{{ item }}</el-link>
|
|
38
|
+
</div>
|
|
39
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
40
|
+
<p class="text-xs">
|
|
41
|
+
<code><el-link disabled>Devre Dışı</el-link></code>
|
|
42
|
+
</p>
|
|
43
|
+
</div>
|
|
44
|
+
</section>
|
|
47
45
|
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
46
|
+
<section>
|
|
47
|
+
<h1>Sizes</h1>
|
|
48
|
+
<p class="p-lg my-6">
|
|
49
|
+
El Link bileşeninin farklı boyutlarda kullanımı için 5 örnek yer almaktadır. 'large', 'medium', 'medium-custom', 'small', 'xsmall'
|
|
50
|
+
</p>
|
|
51
|
+
<div class="grid grid-flow-col auto-cols-max gap-4">
|
|
52
|
+
<el-link type="primary" :underline="false">Alt Çizgi Yok</el-link>
|
|
53
|
+
<el-link type="primary" class="large">Alt Çizgiyle</el-link>
|
|
54
|
+
<el-link type="primary" class="medium">Alt Çizgiyle</el-link>
|
|
55
|
+
<el-link type="primary" class="medium-custom">Alt Çizgiyle</el-link>
|
|
56
|
+
<el-link type="primary" class="small">Alt Çizgiyle</el-link>
|
|
57
|
+
<el-link type="primary" class="xsmall">Alt Çizgiyle</el-link>
|
|
58
|
+
</div>
|
|
59
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
60
|
+
<p class="text-xs">
|
|
61
|
+
<code><el-link :underline="false">Alt Çizgi Yok</el-link></code>
|
|
62
|
+
</p>
|
|
63
|
+
</div>
|
|
64
|
+
</section>
|
|
67
65
|
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
66
|
+
<section>
|
|
67
|
+
<h1>Alt Çizgi</h1>
|
|
68
|
+
<p class="p-lg my-6">
|
|
69
|
+
El Link bileşeninin alt çizgisini göstermek veya gizlemek için <code>:underline="false"</code> özelliğini kullanabilirsiniz.
|
|
70
|
+
</p>
|
|
71
|
+
<div class="grid grid-flow-col auto-cols-max gap-4">
|
|
72
|
+
<el-link type="primary" :underline="false">Alt Çizgi Yok</el-link>
|
|
73
|
+
<el-link type="primary">Alt Çizgiyle</el-link>
|
|
74
|
+
</div>
|
|
75
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
76
|
+
<p class="text-xs">
|
|
77
|
+
<code><el-link :underline="false">Alt Çizgi Yok</el-link></code>
|
|
78
|
+
</p>
|
|
79
|
+
</div>
|
|
80
|
+
</section>
|
|
83
81
|
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
82
|
+
<section>
|
|
83
|
+
<h1>İkon</h1>
|
|
84
|
+
<p class="p-lg my-6">El Link bileşeni, metin veya bağlantı ile birlikte ikonlar eklemenize olanak tanır.</p>
|
|
85
|
+
<div class="grid grid-flow-col auto-cols-max gap-4">
|
|
86
|
+
<el-link type="primary" icon="el-icon-edit">Düzenle</el-link>
|
|
87
|
+
<el-link type="primary">Onayla<i class="el-icon-view el-icon--right"></i> </el-link>
|
|
88
|
+
</div>
|
|
89
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
90
|
+
<p class="text-xs">
|
|
91
|
+
<code><el-link icon="el-icon-edit">Düzenle</el-link></code>
|
|
92
|
+
</p>
|
|
93
|
+
</div>
|
|
94
|
+
</section>
|
|
95
|
+
</div>
|
|
98
96
|
</template>
|
|
99
97
|
|
|
100
98
|
<script>
|
|
101
99
|
import Vue from 'vue';
|
|
102
100
|
|
|
103
101
|
export default Vue.extend({
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
102
|
+
name: 'TimusButtonSample',
|
|
103
|
+
data() {
|
|
104
|
+
return {
|
|
105
|
+
colors: ['primary', 'secondary', 'gray', 'info', 'success', 'warning', 'danger'],
|
|
106
|
+
};
|
|
107
|
+
},
|
|
110
108
|
});
|
|
111
109
|
</script>
|
|
@@ -0,0 +1,280 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="pt-8 pb-16 flex gap-12 flex-col">
|
|
3
|
+
<section>
|
|
4
|
+
<h1>Sizes</h1>
|
|
5
|
+
<p class="p-md-c my-6">
|
|
6
|
+
Avatarlar, resimler, ikonlar veya alfanumerik karakterleri destekler. Avatar'ın şeklini ve boyutunu ayarlamak için `shape` ve `size`
|
|
7
|
+
özelliklerini kullanabilirsiniz. Ayrıca avatarın resim kaynağını belirlemek için `src` özelliğini kullanabilirsiniz. Şekil tipleri
|
|
8
|
+
<b>'circle | square'</b> şeklindedir. Boyutlar ise <b>'xlarge', 'large', 'medium', 'small', 'xsmall'</b> şeklindedir. Veya boyutu manuel
|
|
9
|
+
olarak `size` özelliğini kullanarak belirleyebilirsiniz, örneğin <b>size='50'</b>.
|
|
10
|
+
</p>
|
|
11
|
+
<div class="grid grid-flow-col auto-cols-max gap-4 items-center">
|
|
12
|
+
<div data-testid="components-sidebar-eitdurshvb" id="sidebar" class="flex flex-col justify-center">
|
|
13
|
+
<nuxt-link class="logo-small py-10" to="/" :id="'header-logo-' + TP" data-testid="header-manager-logo"></nuxt-link>
|
|
14
|
+
<el-menu
|
|
15
|
+
class="mt-4"
|
|
16
|
+
data-testid="components-sidebar-afpbszwnwh"
|
|
17
|
+
id="el-menu-primary"
|
|
18
|
+
:default-active="activeMenuItem ? activeMenuItem.toString() : '1'"
|
|
19
|
+
:collapse="isCollapse"
|
|
20
|
+
>
|
|
21
|
+
<el-menu-item data-testid="components-sidebar-ycllqnbrv" index="1" data-index="1">
|
|
22
|
+
<nuxt-link class="el-menu-link" to="/" data-testid="sidebar-dashboard">
|
|
23
|
+
<el-tooltip
|
|
24
|
+
data-testid="components-sidebar-erxgphehpj"
|
|
25
|
+
:disabled="true"
|
|
26
|
+
class="item"
|
|
27
|
+
effect="dark"
|
|
28
|
+
content="Dashboard"
|
|
29
|
+
placement="right"
|
|
30
|
+
>
|
|
31
|
+
<i class="isax-grid-3"></i>
|
|
32
|
+
</el-tooltip>
|
|
33
|
+
<span class="el-menu-text">Dashboard</span>
|
|
34
|
+
</nuxt-link>
|
|
35
|
+
</el-menu-item>
|
|
36
|
+
<el-menu-item data-testid="components-sidebar-lhxzcthocp" index="2" data-index="2">
|
|
37
|
+
<nuxt-link class="el-menu-link" to="/users" data-testid="sidebar-users">
|
|
38
|
+
<el-tooltip data-testid="components-sidebar-gegdseotki" :disabled="true" class="item" effect="dark" content="Users" placement="right">
|
|
39
|
+
<i class="isax-profile-circle"></i>
|
|
40
|
+
</el-tooltip>
|
|
41
|
+
<span class="el-menu-text">User & Teams</span>
|
|
42
|
+
</nuxt-link>
|
|
43
|
+
</el-menu-item>
|
|
44
|
+
<el-menu-item data-testid="components-sidebar-mpftdiklbu" index="3" data-index="3">
|
|
45
|
+
<nuxt-link class="el-menu-link" to="/devices" data-testid="sidebar-devices">
|
|
46
|
+
<el-tooltip
|
|
47
|
+
data-testid="components-sidebar-knxsyjfjwd"
|
|
48
|
+
:disabled="true"
|
|
49
|
+
class="item"
|
|
50
|
+
effect="dark"
|
|
51
|
+
content="Devices"
|
|
52
|
+
placement="right"
|
|
53
|
+
>
|
|
54
|
+
<i class="isax-monitor-mobbile"></i>
|
|
55
|
+
</el-tooltip>
|
|
56
|
+
<span class="el-menu-text">Devices</span>
|
|
57
|
+
</nuxt-link>
|
|
58
|
+
</el-menu-item>
|
|
59
|
+
|
|
60
|
+
<el-menu-item data-testid="components-sidebar-yzjnblrbvn" v-if="TP === 'berqnet'" index="4" data-index="4">
|
|
61
|
+
<nuxt-link class="el-menu-link" to="/sites" data-testid="sidebar-sites">
|
|
62
|
+
<el-tooltip data-testid="components-sidebar-usdojbrni" :disabled="true" class="item" effect="dark" content="Sites" placement="right">
|
|
63
|
+
<i class="isax-driver-2"></i>
|
|
64
|
+
</el-tooltip>
|
|
65
|
+
<span class="el-menu-text">Sites</span>
|
|
66
|
+
</nuxt-link>
|
|
67
|
+
</el-menu-item>
|
|
68
|
+
<el-menu-item data-testid="components-sidebar-wezwxkkphc" v-else index="4" data-index="4">
|
|
69
|
+
<nuxt-link class="el-menu-link" to="/sites" data-testid="sidebar-sites">
|
|
70
|
+
<el-tooltip data-testid="components-sidebar-qjjhulhbpp" :disabled="true" class="item" effect="dark" content="Sites" placement="right">
|
|
71
|
+
<i class="isax-driver-2"></i>
|
|
72
|
+
</el-tooltip>
|
|
73
|
+
<span class="el-menu-text">Sites</span>
|
|
74
|
+
</nuxt-link>
|
|
75
|
+
</el-menu-item>
|
|
76
|
+
|
|
77
|
+
<el-submenu data-testid="components-sidebar-tmdvrlndak" class="sub-menus" index="5" data-index="5">
|
|
78
|
+
<template slot="title">
|
|
79
|
+
<el-tooltip :disabled="true" class="item" effect="dark" content="Insights" placement="right" data-testid="sidebar-rules">
|
|
80
|
+
<i class="isax-key-square"></i>
|
|
81
|
+
</el-tooltip>
|
|
82
|
+
<span class="el-menu-text">Rules</span>
|
|
83
|
+
</template>
|
|
84
|
+
|
|
85
|
+
<el-menu-item data-testid="components-sidebar-pezlxnffvl" index="5-1" data-index="5-1">
|
|
86
|
+
<nuxt-link class="el-menu-link" to="/rules/firewall" data-testid="sidebar-rules-firewall">
|
|
87
|
+
<span class="el-menu-text">Firewall</span>
|
|
88
|
+
</nuxt-link>
|
|
89
|
+
</el-menu-item>
|
|
90
|
+
|
|
91
|
+
<el-menu-item data-testid="components-sidebar-jvruigbwdp" v-if="TP != 'timus'" index="5-2" data-index="5-2">
|
|
92
|
+
<nuxt-link class="el-menu-link" to="/rules/routes" data-testid="sidebar-rules-routes">
|
|
93
|
+
<span class="el-menu-text">Routes</span>
|
|
94
|
+
</nuxt-link>
|
|
95
|
+
</el-menu-item>
|
|
96
|
+
|
|
97
|
+
<el-menu-item data-testid="components-sidebar-iizzyuvzkh" index="5-3" data-index="5-3">
|
|
98
|
+
<nuxt-link class="el-menu-link" to="/rules/forwarding" data-testid="sidebar-rules-forwarding">
|
|
99
|
+
<span class="el-menu-text">Forwarding</span>
|
|
100
|
+
</nuxt-link>
|
|
101
|
+
</el-menu-item>
|
|
102
|
+
|
|
103
|
+
<!-- <el-menu-item data-testid="components-sidebar-krxfszjkyp" index="5-4" data-index="5-4">
|
|
104
|
+
<nuxt-link class="el-menu-link" to="/rules/optimizations" data-testid="sidebar-rules-optimizations">
|
|
105
|
+
<span class="el-menu-text">{{ $t("sidebar.rules.optimizations.text") }}</span>
|
|
106
|
+
</nuxt-link>
|
|
107
|
+
</el-menu-item> -->
|
|
108
|
+
|
|
109
|
+
<el-menu-item data-testid="components-sidebar-ptienrknds" index="5-4" data-index="5-4">
|
|
110
|
+
<nuxt-link class="el-menu-link" to="/rules/acls" data-testid="sidebar-rules-acls">
|
|
111
|
+
<span class="el-menu-text">Access Control List</span>
|
|
112
|
+
</nuxt-link>
|
|
113
|
+
</el-menu-item>
|
|
114
|
+
</el-submenu>
|
|
115
|
+
|
|
116
|
+
<el-submenu data-testid="components-sidebar-bnihbcpjuh" class="sub-menus" index="6" data-index="6">
|
|
117
|
+
<template slot="title">
|
|
118
|
+
<el-tooltip :disabled="true" class="item" effect="dark" content="Ztna" placement="right" data-testid="sidebar-ztna">
|
|
119
|
+
<i class="isax-shield"></i>
|
|
120
|
+
</el-tooltip>
|
|
121
|
+
<span class="el-menu-text">Zero Trust Security</span>
|
|
122
|
+
</template>
|
|
123
|
+
<el-menu-item data-testid="components-sidebar-nettrmotu" index="6-1" data-index="6-1">
|
|
124
|
+
<nuxt-link class="el-menu-link" to="/ztna/dashboard" data-testid="sidebar-ztna-dashboard">
|
|
125
|
+
<span class="el-menu-text">Dashboard</span>
|
|
126
|
+
</nuxt-link>
|
|
127
|
+
</el-menu-item>
|
|
128
|
+
<el-menu-item data-testid="components-sidebar-svzpertkjn" index="6-2" data-index="6-2">
|
|
129
|
+
<nuxt-link class="el-menu-link" to="/ztna/behavior-detection" data-testid="sidebar-ztna-behavior">
|
|
130
|
+
<span class="el-menu-text">Behaviors</span>
|
|
131
|
+
</nuxt-link>
|
|
132
|
+
</el-menu-item>
|
|
133
|
+
<el-menu-item data-testid="components-sidebar-voglodqvvx" index="6-3" data-index="6-3">
|
|
134
|
+
<nuxt-link class="el-menu-link" to="/ztna/user-sign-on-policies" data-testid="sidebar-ztna-user-sign-on">
|
|
135
|
+
<span class="el-menu-text">User Sign-In Policies</span>
|
|
136
|
+
</nuxt-link>
|
|
137
|
+
</el-menu-item>
|
|
138
|
+
<el-menu-item data-testid="components-sidebar-vzizrrtpzn" index="6-4" data-index="6-4">
|
|
139
|
+
<nuxt-link class="el-menu-link" to="/ztna/admin-sign-on-policies" data-testid="sidebar-ztna-admin-sign-on">
|
|
140
|
+
<span class="el-menu-text">Admin Sign-In Policies</span>
|
|
141
|
+
</nuxt-link>
|
|
142
|
+
</el-menu-item>
|
|
143
|
+
</el-submenu>
|
|
144
|
+
|
|
145
|
+
<el-submenu data-testid="components-sidebar-neymnnlec" class="sub-menus" index="7" data-index="7">
|
|
146
|
+
<template slot="title">
|
|
147
|
+
<el-tooltip :disabled="true" class="item" effect="dark" content="Insights" placement="right" data-testid="sidebar-insights">
|
|
148
|
+
<i class="isax-folder-open"></i>
|
|
149
|
+
</el-tooltip>
|
|
150
|
+
<span class="el-menu-text">Insights</span>
|
|
151
|
+
</template>
|
|
152
|
+
|
|
153
|
+
<el-menu-item data-testid="components-sidebar-mtklcicmi" index="7-1" data-index="7-1">
|
|
154
|
+
<nuxt-link class="el-menu-link" to="/insights/alerts" data-testid="sidebar-insights-alerts">
|
|
155
|
+
<span class="el-menu-text">Alerts</span>
|
|
156
|
+
</nuxt-link>
|
|
157
|
+
</el-menu-item>
|
|
158
|
+
|
|
159
|
+
<!-- <el-menu-item data-testid="components-sidebar-pfrrtymjti" index="7-2" data-index="7-2">
|
|
160
|
+
<nuxt-link class="el-menu-link" to="/insights/threats" data-testid="sidebar-threats">
|
|
161
|
+
<span class="el-menu-text">{{ $t("sidebar.threats.text") }}</span>
|
|
162
|
+
</nuxt-link>
|
|
163
|
+
</el-menu-item> -->
|
|
164
|
+
|
|
165
|
+
<el-menu-item data-testid="components-sidebar-selflhiujn" index="7-3" data-index="7-3">
|
|
166
|
+
<nuxt-link class="el-menu-link" to="/insights/traffic" data-testid="sidebar-insights-all-traffic">
|
|
167
|
+
<span class="el-menu-text">Traffic Logs</span>
|
|
168
|
+
</nuxt-link>
|
|
169
|
+
</el-menu-item>
|
|
170
|
+
|
|
171
|
+
<el-menu-item data-testid="components-sidebar-toksfhzzfq" index="7-4" data-index="7-4">
|
|
172
|
+
<nuxt-link class="el-menu-link" to="/insights/events" data-testid="sidebar-insights-events">
|
|
173
|
+
<span class="el-menu-text">Events</span>
|
|
174
|
+
</nuxt-link>
|
|
175
|
+
</el-menu-item>
|
|
176
|
+
|
|
177
|
+
<el-menu-item data-testid="components-sidebar-cnudlizsfg" index="7-5" data-index="7-5">
|
|
178
|
+
<nuxt-link class="el-menu-link" to="/insights/reports" data-testid="sidebar-insights-automate-reports">
|
|
179
|
+
<span class="el-menu-text">Automated Reports</span>
|
|
180
|
+
</nuxt-link>
|
|
181
|
+
</el-menu-item>
|
|
182
|
+
|
|
183
|
+
<el-menu-item data-testid="components-sidebar-kvhegftktx" index="7-6" data-index="7-6">
|
|
184
|
+
<nuxt-link class="el-menu-link" to="/insights/blocked-ips" data-testid="sidebar-insights-blocked-ips">
|
|
185
|
+
<span class="el-menu-text">Blocked Ip Addresses</span>
|
|
186
|
+
</nuxt-link>
|
|
187
|
+
</el-menu-item>
|
|
188
|
+
|
|
189
|
+
<el-menu-item data-testid="components-sidebar-ewrnsjeynv" v-if="TP != 'timus'" index="7-7" data-index="7-7">
|
|
190
|
+
<nuxt-link class="el-menu-link" to="/insights/signed-logs" data-testid="sidebar-insights-signed-logs">
|
|
191
|
+
<span class="el-menu-text">{{ $t('sidebar.insights.signed_logs.text') }}</span>
|
|
192
|
+
</nuxt-link>
|
|
193
|
+
</el-menu-item>
|
|
194
|
+
</el-submenu>
|
|
195
|
+
|
|
196
|
+
<el-submenu data-testid="components-sidebar-jcaexatpod" class="sub-menus" index="8" data-index="8">
|
|
197
|
+
<template slot="title">
|
|
198
|
+
<el-tooltip :disabled="true" class="item" effect="dark" content="Settings" placement="right" data-testid="sidebar-settings">
|
|
199
|
+
<i class="isax-setting-2"></i>
|
|
200
|
+
</el-tooltip>
|
|
201
|
+
<span class="el-menu-text">Settings</span>
|
|
202
|
+
</template>
|
|
203
|
+
<el-menu-item data-testid="components-sidebar-fswikkipil" v-if="TP != 'timus'" index="8-1" data-index="8-1">
|
|
204
|
+
<nuxt-link class="el-menu-link" to="/settings/captive-portals" data-testid="sidebar-settings-captive-portal">
|
|
205
|
+
<span class="el-menu-text">Captive Portal</span>
|
|
206
|
+
</nuxt-link>
|
|
207
|
+
</el-menu-item>
|
|
208
|
+
<el-menu-item data-testid="components-sidebar-rcngltetam" index="8-2" data-index="8-2">
|
|
209
|
+
<nuxt-link class="el-menu-link" to="/settings/integrations" data-testid="sidebar-settings-integrations">
|
|
210
|
+
<span class="el-menu-text">Integrations</span>
|
|
211
|
+
</nuxt-link>
|
|
212
|
+
</el-menu-item>
|
|
213
|
+
<el-menu-item data-testid="components-sidebar-zvuhmrdamh" index="8-3" data-index="8-3">
|
|
214
|
+
<nuxt-link class="el-menu-link" to="/settings/configuration" data-testid="sidebar-settings-configuration">
|
|
215
|
+
<span class="el-menu-text">Configuration</span>
|
|
216
|
+
</nuxt-link>
|
|
217
|
+
</el-menu-item>
|
|
218
|
+
<el-menu-item data-testid="components-sidebar-sjavprmmmj" index="8-4" data-index="8-4">
|
|
219
|
+
<nuxt-link class="el-menu-link" to="/settings/administrators" data-testid="sidebar-settings-administrators">
|
|
220
|
+
<span class="el-menu-text">Administrators</span>
|
|
221
|
+
</nuxt-link>
|
|
222
|
+
</el-menu-item>
|
|
223
|
+
<el-menu-item data-testid="components-sidebar-iywlhkkmta" index="8-5" data-index="8-5">
|
|
224
|
+
<nuxt-link class="el-menu-link" to="/settings/organization" data-testid="sidebar-settings-organization">
|
|
225
|
+
<span class="el-menu-text">Organization</span>
|
|
226
|
+
</nuxt-link>
|
|
227
|
+
</el-menu-item>
|
|
228
|
+
<el-menu-item data-testid="components-sidebar-yxbnijbpmj" index="8-6" data-index="8-6">
|
|
229
|
+
<nuxt-link class="el-menu-link" to="/settings/downloads" data-testid="sidebar-settings-downloads">
|
|
230
|
+
<span class="el-menu-text">Downloads</span>
|
|
231
|
+
</nuxt-link>
|
|
232
|
+
</el-menu-item>
|
|
233
|
+
</el-submenu>
|
|
234
|
+
</el-menu>
|
|
235
|
+
</div>
|
|
236
|
+
</div>
|
|
237
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
238
|
+
<p class="text-xs">
|
|
239
|
+
<code><el-avatar :size="50">SK</el-avatar></code>
|
|
240
|
+
</p>
|
|
241
|
+
</div>
|
|
242
|
+
</section>
|
|
243
|
+
|
|
244
|
+
<section>
|
|
245
|
+
<h1>Types</h1>
|
|
246
|
+
<p class="p-md-c my-6">You can use any 'string' expression within the tag, in addition to a type that accepts 'src' or 'icon' as a property.</p>
|
|
247
|
+
<div class="grid grid-flow-col auto-cols-max gap-4 items-center">
|
|
248
|
+
<el-avatar icon="isax-add-circle"></el-avatar>
|
|
249
|
+
<el-avatar icon="isax-add-circle" size="xlarge"></el-avatar>
|
|
250
|
+
<el-avatar :src="url"></el-avatar>
|
|
251
|
+
<el-avatar>SK</el-avatar>
|
|
252
|
+
</div>
|
|
253
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
254
|
+
<p class="text-xs">
|
|
255
|
+
<code><el-avatar icon="isax-add-circle" size="xlarge"></el-avatar></code>
|
|
256
|
+
</p>
|
|
257
|
+
</div>
|
|
258
|
+
</section>
|
|
259
|
+
</div>
|
|
260
|
+
</template>
|
|
261
|
+
|
|
262
|
+
<script>
|
|
263
|
+
import Vue from 'vue';
|
|
264
|
+
|
|
265
|
+
export default Vue.extend({
|
|
266
|
+
name: 'TimusCascader',
|
|
267
|
+
data() {
|
|
268
|
+
return {
|
|
269
|
+
url: 'https://api.dicebear.com/7.x/adventurer-neutral/svg?seed=Princess',
|
|
270
|
+
sizeList: ['xlarge', 'large', 'medium', 'small', 'xsmall'],
|
|
271
|
+
|
|
272
|
+
data() {
|
|
273
|
+
return {
|
|
274
|
+
isCollapse: false,
|
|
275
|
+
};
|
|
276
|
+
},
|
|
277
|
+
};
|
|
278
|
+
},
|
|
279
|
+
});
|
|
280
|
+
</script>
|
|
@@ -1,44 +1,45 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
</
|
|
2
|
+
<div class="container">
|
|
3
|
+
<el-tabs v-model="activeName" @tab-click="handleClick">
|
|
4
|
+
<el-tab-pane label="Button" name="first"><ThemeButtons></ThemeButtons></el-tab-pane>
|
|
5
|
+
<el-tab-pane label="Typo" name="second"><ThemeTypo></ThemeTypo></el-tab-pane>
|
|
6
|
+
<el-tab-pane label="Input" name="third"><ThemeInputs></ThemeInputs></el-tab-pane>
|
|
7
|
+
<el-tab-pane label="Checkbox" name="fourth"><ThemeCheckbox></ThemeCheckbox></el-tab-pane>
|
|
8
|
+
<el-tab-pane label="Radio" name="five"><ThemeRadio></ThemeRadio></el-tab-pane>
|
|
9
|
+
<el-tab-pane label="Number" name="six"><ThemeInputNumbers></ThemeInputNumbers></el-tab-pane>
|
|
10
|
+
<el-tab-pane label="Picker" name="seven"><ThemeTimePicker></ThemeTimePicker></el-tab-pane>
|
|
11
|
+
<el-tab-pane label="Select" name="eight"><ThemeSelect></ThemeSelect></el-tab-pane>
|
|
12
|
+
<el-tab-pane label="Form" name="nine"><ThemeForm></ThemeForm></el-tab-pane>
|
|
13
|
+
<el-tab-pane label="Link" name="ten"><ThemeLink></ThemeLink></el-tab-pane>
|
|
14
|
+
<el-tab-pane label="Tag" name="eleven"><ThemeTag></ThemeTag></el-tab-pane>
|
|
15
|
+
<el-tab-pane label="Switch" name="twelve"><ThemeToggle></ThemeToggle></el-tab-pane>
|
|
16
|
+
<el-tab-pane label="Table" name="thirteen"><ThemeTable></ThemeTable></el-tab-pane>
|
|
17
|
+
<el-tab-pane label="Tooltip" name="fourteen"><ThemeTooltip></ThemeTooltip></el-tab-pane>
|
|
18
|
+
<el-tab-pane label="Alert" name="fifteen"><ThemeAlert></ThemeAlert></el-tab-pane>
|
|
19
|
+
<el-tab-pane label="Cascader" name="sixteen"><ThemeCascader></ThemeCascader></el-tab-pane>
|
|
20
|
+
<el-tab-pane label="Badge" name="seventeen"><ThemeBadge></ThemeBadge></el-tab-pane>
|
|
21
|
+
<el-tab-pane label="Avatar" name="eighteen"><ThemeAvatar></ThemeAvatar></el-tab-pane>
|
|
22
|
+
<el-tab-pane label="Logo" name="nineteen"><ThemeLogo></ThemeLogo></el-tab-pane>
|
|
23
|
+
<el-tab-pane label="Dialog" name="twenty"><ThemeDialog></ThemeDialog></el-tab-pane>
|
|
24
|
+
<el-tab-pane label="Sidebar" name="twenty-one"><ThemeSidebar></ThemeSidebar></el-tab-pane>
|
|
25
|
+
</el-tabs>
|
|
26
|
+
</div>
|
|
26
27
|
</template>
|
|
27
28
|
<script>
|
|
28
29
|
import ThemeInputNumbers from './ThemeInputNumbers.vue';
|
|
29
30
|
import ThemeInputs from './ThemeInputs.vue';
|
|
30
31
|
|
|
31
32
|
export default {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
33
|
+
data() {
|
|
34
|
+
return {
|
|
35
|
+
activeName: 'first',
|
|
36
|
+
};
|
|
37
|
+
},
|
|
38
|
+
methods: {
|
|
39
|
+
handleClick(tab, event) {
|
|
40
|
+
console.log(tab, event);
|
|
36
41
|
},
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
console.log(tab, event);
|
|
40
|
-
},
|
|
41
|
-
},
|
|
42
|
-
components: { ThemeInputs, ThemeInputNumbers },
|
|
42
|
+
},
|
|
43
|
+
components: { ThemeInputs, ThemeInputNumbers },
|
|
43
44
|
};
|
|
44
45
|
</script>
|