@policystudio/policy-studio-ui-vue 1.1.26 → 1.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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@policystudio/policy-studio-ui-vue",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.28",
|
|
4
4
|
"description": "Policy Studio UI",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"author": "Policy Studio Team",
|
|
@@ -24,6 +24,7 @@
|
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
26
|
"core-js": "^3.6.5",
|
|
27
|
+
"v-tooltip": "^2.1.3",
|
|
27
28
|
"vue": "^2.6.11"
|
|
28
29
|
},
|
|
29
30
|
"devDependencies": {
|
|
@@ -7,7 +7,13 @@
|
|
|
7
7
|
v-model="model"
|
|
8
8
|
:disabled="disabled"
|
|
9
9
|
/>
|
|
10
|
-
<label
|
|
10
|
+
<label
|
|
11
|
+
:for="label"
|
|
12
|
+
class="psui-el-checkmark"
|
|
13
|
+
:class="[labelClasses, 'psui-el-checkmark']"
|
|
14
|
+
>
|
|
15
|
+
<span>{{ label }}</span>
|
|
16
|
+
</label>
|
|
11
17
|
</div>
|
|
12
18
|
</template>
|
|
13
19
|
|
|
@@ -24,6 +30,13 @@ export default {
|
|
|
24
30
|
type: String,
|
|
25
31
|
default: '',
|
|
26
32
|
},
|
|
33
|
+
/**
|
|
34
|
+
* It sets the label classes.
|
|
35
|
+
*/
|
|
36
|
+
labelClasses: {
|
|
37
|
+
type: String,
|
|
38
|
+
default: ''
|
|
39
|
+
},
|
|
27
40
|
/**
|
|
28
41
|
* It sets the value which should be monitored.
|
|
29
42
|
*/
|
|
@@ -50,18 +50,19 @@
|
|
|
50
50
|
@click.native="onCollapse(item)"
|
|
51
51
|
/>
|
|
52
52
|
|
|
53
|
-
<
|
|
53
|
+
<div
|
|
54
54
|
v-if="item.is_disabled || item.tooltip_text"
|
|
55
|
-
layout="gray"
|
|
56
|
-
position="top"
|
|
57
55
|
class="psui-inline-flex psui-cursor-default sticky"
|
|
58
56
|
:class="{ 'is-last-deep' : item.last_deep }"
|
|
57
|
+
v-tooltip="{
|
|
58
|
+
content: getTooltipContent(item),
|
|
59
|
+
classes : 'layout-gray'
|
|
60
|
+
}"
|
|
59
61
|
>
|
|
60
|
-
<
|
|
61
|
-
<div class="flex psui-items-center psui-relative ">
|
|
62
|
+
<div class="flex psui-items-center psui-relative ">
|
|
62
63
|
<PsIcon v-if="item.has_blocked_icon" icon="do_disturb_alt" size="14" icon-classes="psui-absolute psui--left-1 psui-text-gray-50"/>
|
|
63
64
|
<p class="title psui-text-gray-50 opacity-100-childrens-on-hover">
|
|
64
|
-
|
|
65
|
+
|
|
65
66
|
{{ item.title }}
|
|
66
67
|
|
|
67
68
|
<PsIcon
|
|
@@ -74,22 +75,8 @@
|
|
|
74
75
|
/>
|
|
75
76
|
</p>
|
|
76
77
|
</div>
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
<p
|
|
80
|
-
v-if="item.tooltip_text"
|
|
81
|
-
class="psui-font-bold psui-text-gray-80 psui-text-xsmall"
|
|
82
|
-
>
|
|
83
|
-
{{ item.tooltip_text }}
|
|
84
|
-
</p>
|
|
85
|
-
<p
|
|
86
|
-
v-else-if="item.is_disabled"
|
|
87
|
-
class="psui-font-bold psui-text-gray-80 psui-text-xsmall"
|
|
88
|
-
>
|
|
89
|
-
{{ item.title }} buildings are <br>not allowed.
|
|
90
|
-
</p>
|
|
91
|
-
</template>
|
|
92
|
-
</PsRichTooltip>
|
|
78
|
+
</div>
|
|
79
|
+
|
|
93
80
|
<p
|
|
94
81
|
v-else
|
|
95
82
|
class="title opacity-100-childrens-on-hover"
|
|
@@ -564,6 +551,15 @@ export default {
|
|
|
564
551
|
return tailwindConfig.theme.colors[value.replace('psui-bg-', '')]
|
|
565
552
|
}
|
|
566
553
|
return value || '#ffffff'
|
|
554
|
+
},
|
|
555
|
+
getTooltipContent(item) {
|
|
556
|
+
let content = ''
|
|
557
|
+
if (item.tooltip_text) {
|
|
558
|
+
content = `<p class="psui-font-bold psui-text-gray-80 psui-text-xsmall">${item.tooltip_text}</p>`
|
|
559
|
+
} else if (item.is_disabled) {
|
|
560
|
+
content = `<p class="psui-font-bold psui-text-gray-80 psui-text-xsmall">${item.title} buildings are <br>not allowed.</p>`
|
|
561
|
+
}
|
|
562
|
+
return content
|
|
567
563
|
}
|
|
568
564
|
},
|
|
569
565
|
}
|