@tekkare/auriga 0.1.31 → 0.1.33
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
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div :class="`radio_display radio_${dir}`">
|
|
3
|
+
<div
|
|
4
|
+
v-for="(radio, index) in elements"
|
|
5
|
+
:key="index"
|
|
6
|
+
class="oip_row v-center gap-4 radio_item"
|
|
7
|
+
:class="selectedRadio === index + 1 ? 'selected-radio' : 'display-radio'"
|
|
8
|
+
@click="selectRadio(index + 1, radio)"
|
|
9
|
+
>
|
|
10
|
+
<arg-icon
|
|
11
|
+
:name="getIconName(index + 1)"
|
|
12
|
+
size="20"
|
|
13
|
+
:color="getColor(index + 1)"
|
|
14
|
+
thickness="24"
|
|
15
|
+
/>
|
|
16
|
+
<p>{{ radio.title }}</p>
|
|
17
|
+
</div>
|
|
18
|
+
</div>
|
|
19
|
+
</template>
|
|
20
|
+
|
|
21
|
+
<script>
|
|
22
|
+
import argIcon from "./argIcon.vue";
|
|
23
|
+
import {
|
|
24
|
+
onMounted,
|
|
25
|
+
ref,
|
|
26
|
+
defineComponent
|
|
27
|
+
} from "vue";
|
|
28
|
+
export default defineComponent({
|
|
29
|
+
name: "argRadioButtons",
|
|
30
|
+
components: {
|
|
31
|
+
argIcon
|
|
32
|
+
},
|
|
33
|
+
props: {
|
|
34
|
+
elements: {
|
|
35
|
+
type: Array,
|
|
36
|
+
required: true
|
|
37
|
+
},
|
|
38
|
+
defaultSelect: {
|
|
39
|
+
type: Number,
|
|
40
|
+
default: null
|
|
41
|
+
},
|
|
42
|
+
returnValue: {
|
|
43
|
+
type: Boolean,
|
|
44
|
+
default: true
|
|
45
|
+
},
|
|
46
|
+
dir: {
|
|
47
|
+
type: String,
|
|
48
|
+
default: "row"
|
|
49
|
+
}
|
|
50
|
+
},
|
|
51
|
+
emits: ["changeElement", "update:Selection"],
|
|
52
|
+
setup(props, { emit }) {
|
|
53
|
+
const selectedRadio = ref(null);
|
|
54
|
+
onMounted(() => {
|
|
55
|
+
if (typeof props.defaultSelect === "number") {
|
|
56
|
+
selectedRadio.value = props.defaultSelect;
|
|
57
|
+
}
|
|
58
|
+
});
|
|
59
|
+
function selectRadio(index, value) {
|
|
60
|
+
selectedRadio.value = index;
|
|
61
|
+
if (props.returnValue) {
|
|
62
|
+
emit("changeElement", value);
|
|
63
|
+
emit("update:Selection", value);
|
|
64
|
+
} else {
|
|
65
|
+
emit("changeElement", selectedRadio.value);
|
|
66
|
+
emit("update:Selection", selectedRadio.value);
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
function getIconName(index) {
|
|
70
|
+
if (index === selectedRadio.value) {
|
|
71
|
+
return "CheckCircleFill";
|
|
72
|
+
} else
|
|
73
|
+
return "Circle";
|
|
74
|
+
}
|
|
75
|
+
function getColor(index) {
|
|
76
|
+
if (index === selectedRadio.value) {
|
|
77
|
+
return "var(--primary)";
|
|
78
|
+
} else
|
|
79
|
+
return "var(--lavendar-grey)";
|
|
80
|
+
}
|
|
81
|
+
return {
|
|
82
|
+
selectedRadio,
|
|
83
|
+
selectRadio,
|
|
84
|
+
getIconName,
|
|
85
|
+
getColor
|
|
86
|
+
};
|
|
87
|
+
}
|
|
88
|
+
});
|
|
89
|
+
</script>
|
|
90
|
+
|
|
91
|
+
<style scoped>
|
|
92
|
+
.display-radio,
|
|
93
|
+
.selected-radio {
|
|
94
|
+
border-radius: 2px;
|
|
95
|
+
cursor: pointer;
|
|
96
|
+
}
|
|
97
|
+
.display-radio:hover,
|
|
98
|
+
.selected-radio:hover {
|
|
99
|
+
background: var(--background);
|
|
100
|
+
box-shadow: 0px 0px 0px 4px #f5f5f9;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
.display-radio:hover svg,
|
|
104
|
+
.selected-radio:hover svg {
|
|
105
|
+
color: var(--primary) !important;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.display-radio p {
|
|
109
|
+
font-weight: 400;
|
|
110
|
+
font-size: 14px;
|
|
111
|
+
line-height: 16px;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
.selected-radio p {
|
|
115
|
+
font-weight: 500;
|
|
116
|
+
font-size: 14px;
|
|
117
|
+
line-height: 16px;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.radio_display {
|
|
121
|
+
display: flex;
|
|
122
|
+
width: 100%;
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
.radio_row {
|
|
126
|
+
flex-direction: row;
|
|
127
|
+
align-items: flex-start;
|
|
128
|
+
flex-wrap: wrap;
|
|
129
|
+
justify-content: space-between;
|
|
130
|
+
gap: 16px;
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
.radio_column {
|
|
134
|
+
flex-direction: column;
|
|
135
|
+
align-items: flex-start;
|
|
136
|
+
gap: 8px;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.radio_element {
|
|
140
|
+
padding: 6px;
|
|
141
|
+
flex: 1 1 0;
|
|
142
|
+
}
|
|
143
|
+
</style>
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
declare const _default: import("vue").DefineComponent<{
|
|
2
|
+
elements: {
|
|
3
|
+
type: {
|
|
4
|
+
(arrayLength: number): string[];
|
|
5
|
+
(...items: string[]): string[];
|
|
6
|
+
new (arrayLength: number): string[];
|
|
7
|
+
new (...items: string[]): string[];
|
|
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
|
+
defaultSelect: {
|
|
20
|
+
type: NumberConstructor;
|
|
21
|
+
default: null;
|
|
22
|
+
};
|
|
23
|
+
returnValue: {
|
|
24
|
+
type: BooleanConstructor;
|
|
25
|
+
default: boolean;
|
|
26
|
+
};
|
|
27
|
+
dir: {
|
|
28
|
+
type: StringConstructor;
|
|
29
|
+
default: string;
|
|
30
|
+
};
|
|
31
|
+
}, {
|
|
32
|
+
selectedRadio: any;
|
|
33
|
+
selectRadio: (index: number, value: string) => void;
|
|
34
|
+
getIconName: (index: number) => "CheckCircleFill" | "Circle";
|
|
35
|
+
getColor: (index: number) => "var(--primary)" | "var(--lavendar-grey)";
|
|
36
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("changeElement" | "update:Selection")[], "changeElement" | "update:Selection", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
37
|
+
elements: {
|
|
38
|
+
type: {
|
|
39
|
+
(arrayLength: number): string[];
|
|
40
|
+
(...items: string[]): string[];
|
|
41
|
+
new (arrayLength: number): string[];
|
|
42
|
+
new (...items: string[]): string[];
|
|
43
|
+
isArray(arg: any): arg is any[];
|
|
44
|
+
readonly prototype: any[];
|
|
45
|
+
from<T>(arrayLike: ArrayLike<T>): T[];
|
|
46
|
+
from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
|
|
47
|
+
from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
|
|
48
|
+
from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
|
|
49
|
+
of<T_4>(...items: T_4[]): T_4[];
|
|
50
|
+
readonly [Symbol.species]: ArrayConstructor;
|
|
51
|
+
};
|
|
52
|
+
required: true;
|
|
53
|
+
};
|
|
54
|
+
defaultSelect: {
|
|
55
|
+
type: NumberConstructor;
|
|
56
|
+
default: null;
|
|
57
|
+
};
|
|
58
|
+
returnValue: {
|
|
59
|
+
type: BooleanConstructor;
|
|
60
|
+
default: boolean;
|
|
61
|
+
};
|
|
62
|
+
dir: {
|
|
63
|
+
type: StringConstructor;
|
|
64
|
+
default: string;
|
|
65
|
+
};
|
|
66
|
+
}>> & {
|
|
67
|
+
onChangeElement?: ((...args: any[]) => any) | undefined;
|
|
68
|
+
"onUpdate:Selection"?: ((...args: any[]) => any) | undefined;
|
|
69
|
+
}, {
|
|
70
|
+
defaultSelect: number;
|
|
71
|
+
returnValue: boolean;
|
|
72
|
+
dir: string;
|
|
73
|
+
}, {}>;
|
|
74
|
+
export default _default;
|
|
@@ -566,15 +566,16 @@ export default defineComponent({
|
|
|
566
566
|
const finalTable = computed(() => {
|
|
567
567
|
const sorted = sortedTable;
|
|
568
568
|
if (props.fullTableScroll === true) {
|
|
569
|
-
sorted.value;
|
|
569
|
+
return sorted.value;
|
|
570
|
+
} else {
|
|
571
|
+
return sorted.value.filter((row, index) => {
|
|
572
|
+
const start = (currentPage.value - 1) * savePageSize.value;
|
|
573
|
+
const end = currentPage.value * savePageSize.value;
|
|
574
|
+
if (index >= start && index < end)
|
|
575
|
+
return true;
|
|
576
|
+
return false;
|
|
577
|
+
});
|
|
570
578
|
}
|
|
571
|
-
return sorted.value.filter((row, index) => {
|
|
572
|
-
const start = (currentPage.value - 1) * savePageSize.value;
|
|
573
|
-
const end = currentPage.value * savePageSize.value;
|
|
574
|
-
if (index >= start && index < end)
|
|
575
|
-
return true;
|
|
576
|
-
return false;
|
|
577
|
-
});
|
|
578
579
|
});
|
|
579
580
|
const resultCount = computed(() => {
|
|
580
581
|
return sortedTable.value.length;
|
|
@@ -690,7 +691,7 @@ export default defineComponent({
|
|
|
690
691
|
padding-left: 0px;
|
|
691
692
|
}
|
|
692
693
|
|
|
693
|
-
.rcd_scrollTable {
|
|
694
|
+
.scroll_table .rcd_scrollTable {
|
|
694
695
|
overflow-x: auto;
|
|
695
696
|
gap: 8px;
|
|
696
697
|
padding-top: 8px;
|