shared-ritm 1.2.30 → 1.2.32

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.
Files changed (39) hide show
  1. package/README.md +103 -103
  2. package/dist/index.css +1 -1
  3. package/dist/shared-ritm.es.js +3244 -3251
  4. package/dist/shared-ritm.umd.js +6 -6
  5. package/package.json +1 -1
  6. package/src/App.vue +2461 -2461
  7. package/src/api/services/GanttService.ts +17 -17
  8. package/src/api/services/MetricsService.ts +101 -101
  9. package/src/api/services/RepairsService.ts +3 -1
  10. package/src/api/settings/ApiService.ts +126 -126
  11. package/src/api/types/Api_Files.ts +1 -1
  12. package/src/api/types/Api_Projects.ts +55 -55
  13. package/src/api/types/Api_Repairs.ts +93 -93
  14. package/src/common/app-checkbox/AppCheckbox.vue +26 -26
  15. package/src/common/app-date-picker/AppDatePicker.vue +81 -81
  16. package/src/common/app-dialogs/AppConfirmDialog.vue +100 -100
  17. package/src/common/app-dropdown/AppDropdown.vue +31 -31
  18. package/src/common/app-icon/AppIcon.vue +108 -108
  19. package/src/common/app-input-search/AppInputSearch.vue +174 -174
  20. package/src/common/app-layout/AppLayout.vue +84 -84
  21. package/src/common/app-layout/components/AppLayoutHeader.vue +246 -246
  22. package/src/common/app-layout/components/AppLayoutPage.vue +16 -16
  23. package/src/common/app-select/AppSelect.vue +157 -157
  24. package/src/common/app-sidebar/components/SidebarMenuItem.vue +146 -146
  25. package/src/common/app-toggle/AppToggle.vue +23 -23
  26. package/src/common/app-wrapper/AppWrapper.vue +28 -28
  27. package/src/icons/dialogs/RemoveIcon.vue +12 -12
  28. package/src/icons/dialogs/SafetyIcon.vue +12 -12
  29. package/src/icons/header/NotificationIcon.vue +18 -18
  30. package/src/icons/header/PersonIcon.vue +11 -11
  31. package/src/icons/header/SettingIcon.vue +14 -14
  32. package/src/icons/task/attention-icon.vue +13 -13
  33. package/src/icons/task/clock-icon.vue +10 -10
  34. package/src/icons/task/delete-icon.vue +10 -10
  35. package/src/icons/task/fire-icon.vue +16 -16
  36. package/src/main.ts +28 -28
  37. package/src/shared/styles/general.css +96 -96
  38. package/src/utils/confirm.ts +12 -12
  39. package/src/utils/notification.ts +9 -9
@@ -1,108 +1,108 @@
1
- <template>
2
- <component :is="sideBarIcon" :tag="tag" :class="[$style['app-icon']]" />
3
- </template>
4
-
5
- <script setup lang="ts">
6
- import ProjectsIcon from '@/icons/sidebar/projects-icon.vue'
7
- import RepairsIcon from '@/icons/sidebar/repairs-icon.vue'
8
- import InstrumentHistoryIcon from '@/icons/sidebar/instrument-history-icon.vue'
9
- import RepairObjectIcon from '@/icons/sidebar/repair-object-icon.vue'
10
- import StatusHistoryIcon from '@/icons/sidebar/status-history-icon.vue'
11
- import SettingIcon from '@/icons/header/SettingIcon.vue'
12
- import PassIcon from '@/icons/sidebar/pass-icon.vue'
13
- import AssignModuleIcon from '@/icons/sidebar/assign-module-icon.vue'
14
- import UsersIcon from '@/icons/sidebar/users-icon.vue'
15
- import UserIcon from '@/icons/sidebar/user-icon.vue'
16
- import WorkzonesIcon from '@/icons/sidebar/workzones-icon.vue'
17
- import LogoutIcon from '@/icons/sidebar/logout-icon.vue'
18
- import LogoIcon from '@/icons/sidebar/logo-icon.vue'
19
- import TasksIcon from '@/icons/sidebar/tasks-icon.vue'
20
- import InstrumentsIcon from '@/icons/sidebar/instruments-icon.vue'
21
- import OrderIcon from '@/icons/sidebar/order-icon.vue'
22
- import ModulesIcon from '@/icons/sidebar/modules-icon.vue'
23
- import NotificationsIcon from '@/icons/sidebar/notifications-icon.vue'
24
- import VideozonesIcon from '@/icons/sidebar/videozones-icon.vue'
25
- import InstrumentWorkZoneIcon from '@/icons/sidebar/instrument-work-zone-icon.vue'
26
- import WorkshopIcon from '@/icons/sidebar/workshop-icon.vue'
27
- import WarehousesIcon from '@/icons/sidebar/warehouses-icon.vue'
28
- import TeamsIcon from '@/icons/sidebar/teams-icon.vue'
29
- import RolesIcon from '@/icons/sidebar/roles-icon.vue'
30
- import PositionsIcon from '@/icons/sidebar/positions-icon.vue'
31
- import PersonIcon from '@/icons/header/PersonIcon.vue'
32
- import InstrumentOrderIcon from '@/icons/sidebar/instrument-order-icon.vue'
33
- import PreorderIcon from '@/icons/sidebar/preorder-icon.vue'
34
- import VideowallIcon from '@/icons/sidebar/videowall-icon.vue'
35
- import VideosourcesIcon from '@/icons/sidebar/videosources-icon.vue'
36
- import Tasks_tasksIcon from '@/icons/sidebar/tasks_tasks-icon.vue'
37
- import Tasks_todayIcon from '@/icons/sidebar/tasks_today-icon.vue'
38
- import ArrowFrameIcon from '@/icons/components/arrow-frame-icon.vue'
39
-
40
- import { computed, defineProps } from 'vue'
41
-
42
- interface Props {
43
- size?: string | undefined
44
- tag?: string | undefined
45
- name: string
46
- color?: string | undefined
47
- }
48
-
49
- const props = withDefaults(defineProps<Props>(), {
50
- tag: '',
51
- name: '',
52
- })
53
-
54
- function toPascalCase(str: string): string {
55
- if (!str) return ''
56
- return str
57
- .split('-')
58
- .map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
59
- .join('')
60
- }
61
- const sideBarIcon = computed(
62
- () =>
63
- ({
64
- ProjectsIcon,
65
- RepairsIcon,
66
- RepairObjectIcon,
67
- InstrumentHistoryIcon,
68
- StatusHistoryIcon,
69
- SettingIcon,
70
- PassIcon,
71
- AssignModuleIcon,
72
- UsersIcon,
73
- UserIcon,
74
- WorkzonesIcon,
75
- LogoutIcon,
76
- LogoIcon,
77
- TasksIcon,
78
- InstrumentsIcon,
79
- OrderIcon,
80
- ModulesIcon,
81
- NotificationsIcon,
82
- VideozonesIcon,
83
- InstrumentWorkZoneIcon,
84
- WorkshopIcon,
85
- WarehousesIcon,
86
- TeamsIcon,
87
- RolesIcon,
88
- PositionsIcon,
89
- PersonIcon,
90
- InstrumentOrderIcon,
91
- PreorderIcon,
92
- VideowallIcon,
93
- VideosourcesIcon,
94
- Tasks_tasksIcon,
95
- Tasks_todayIcon,
96
- ArrowFrameIcon,
97
- }[toPascalCase(props.name)]),
98
- )
99
- </script>
100
-
101
- <style module lang="scss">
102
- .app-icon {
103
- stroke: v-bind(color);
104
- fill: none;
105
- width: v-bind(size);
106
- height: v-bind(size);
107
- }
108
- </style>
1
+ <template>
2
+ <component :is="sideBarIcon" :tag="tag" :class="[$style['app-icon']]" />
3
+ </template>
4
+
5
+ <script setup lang="ts">
6
+ import ProjectsIcon from '@/icons/sidebar/projects-icon.vue'
7
+ import RepairsIcon from '@/icons/sidebar/repairs-icon.vue'
8
+ import InstrumentHistoryIcon from '@/icons/sidebar/instrument-history-icon.vue'
9
+ import RepairObjectIcon from '@/icons/sidebar/repair-object-icon.vue'
10
+ import StatusHistoryIcon from '@/icons/sidebar/status-history-icon.vue'
11
+ import SettingIcon from '@/icons/header/SettingIcon.vue'
12
+ import PassIcon from '@/icons/sidebar/pass-icon.vue'
13
+ import AssignModuleIcon from '@/icons/sidebar/assign-module-icon.vue'
14
+ import UsersIcon from '@/icons/sidebar/users-icon.vue'
15
+ import UserIcon from '@/icons/sidebar/user-icon.vue'
16
+ import WorkzonesIcon from '@/icons/sidebar/workzones-icon.vue'
17
+ import LogoutIcon from '@/icons/sidebar/logout-icon.vue'
18
+ import LogoIcon from '@/icons/sidebar/logo-icon.vue'
19
+ import TasksIcon from '@/icons/sidebar/tasks-icon.vue'
20
+ import InstrumentsIcon from '@/icons/sidebar/instruments-icon.vue'
21
+ import OrderIcon from '@/icons/sidebar/order-icon.vue'
22
+ import ModulesIcon from '@/icons/sidebar/modules-icon.vue'
23
+ import NotificationsIcon from '@/icons/sidebar/notifications-icon.vue'
24
+ import VideozonesIcon from '@/icons/sidebar/videozones-icon.vue'
25
+ import InstrumentWorkZoneIcon from '@/icons/sidebar/instrument-work-zone-icon.vue'
26
+ import WorkshopIcon from '@/icons/sidebar/workshop-icon.vue'
27
+ import WarehousesIcon from '@/icons/sidebar/warehouses-icon.vue'
28
+ import TeamsIcon from '@/icons/sidebar/teams-icon.vue'
29
+ import RolesIcon from '@/icons/sidebar/roles-icon.vue'
30
+ import PositionsIcon from '@/icons/sidebar/positions-icon.vue'
31
+ import PersonIcon from '@/icons/header/PersonIcon.vue'
32
+ import InstrumentOrderIcon from '@/icons/sidebar/instrument-order-icon.vue'
33
+ import PreorderIcon from '@/icons/sidebar/preorder-icon.vue'
34
+ import VideowallIcon from '@/icons/sidebar/videowall-icon.vue'
35
+ import VideosourcesIcon from '@/icons/sidebar/videosources-icon.vue'
36
+ import Tasks_tasksIcon from '@/icons/sidebar/tasks_tasks-icon.vue'
37
+ import Tasks_todayIcon from '@/icons/sidebar/tasks_today-icon.vue'
38
+ import ArrowFrameIcon from '@/icons/components/arrow-frame-icon.vue'
39
+
40
+ import { computed, defineProps } from 'vue'
41
+
42
+ interface Props {
43
+ size?: string | undefined
44
+ tag?: string | undefined
45
+ name: string
46
+ color?: string | undefined
47
+ }
48
+
49
+ const props = withDefaults(defineProps<Props>(), {
50
+ tag: '',
51
+ name: '',
52
+ })
53
+
54
+ function toPascalCase(str: string): string {
55
+ if (!str) return ''
56
+ return str
57
+ .split('-')
58
+ .map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
59
+ .join('')
60
+ }
61
+ const sideBarIcon = computed(
62
+ () =>
63
+ ({
64
+ ProjectsIcon,
65
+ RepairsIcon,
66
+ RepairObjectIcon,
67
+ InstrumentHistoryIcon,
68
+ StatusHistoryIcon,
69
+ SettingIcon,
70
+ PassIcon,
71
+ AssignModuleIcon,
72
+ UsersIcon,
73
+ UserIcon,
74
+ WorkzonesIcon,
75
+ LogoutIcon,
76
+ LogoIcon,
77
+ TasksIcon,
78
+ InstrumentsIcon,
79
+ OrderIcon,
80
+ ModulesIcon,
81
+ NotificationsIcon,
82
+ VideozonesIcon,
83
+ InstrumentWorkZoneIcon,
84
+ WorkshopIcon,
85
+ WarehousesIcon,
86
+ TeamsIcon,
87
+ RolesIcon,
88
+ PositionsIcon,
89
+ PersonIcon,
90
+ InstrumentOrderIcon,
91
+ PreorderIcon,
92
+ VideowallIcon,
93
+ VideosourcesIcon,
94
+ Tasks_tasksIcon,
95
+ Tasks_todayIcon,
96
+ ArrowFrameIcon,
97
+ }[toPascalCase(props.name)]),
98
+ )
99
+ </script>
100
+
101
+ <style module lang="scss">
102
+ .app-icon {
103
+ stroke: v-bind(color);
104
+ fill: none;
105
+ width: v-bind(size);
106
+ height: v-bind(size);
107
+ }
108
+ </style>
@@ -1,174 +1,174 @@
1
- <template>
2
- <q-input
3
- v-model="value"
4
- standout
5
- outlined
6
- clearable
7
- dense
8
- bg-color="white"
9
- :class="[$style['app-input'], itemClasses]"
10
- :type="type"
11
- :readonly="readonly || field"
12
- :placeholder="label"
13
- >
14
- <template v-if="searchIcon" #prepend>
15
- <q-icon>
16
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
17
- <path
18
- d="M11.5 21C16.7467 21 21 16.7467 21 11.5C21 6.25329 16.7467 2 11.5 2C6.25329 2 2 6.25329 2 11.5C2 16.7467 6.25329 21 11.5 21Z"
19
- stroke="#404650"
20
- stroke-width="1.5"
21
- stroke-linecap="round"
22
- stroke-linejoin="round"
23
- />
24
- <path d="M22 22L20 20" stroke="#3F8CFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
25
- </svg>
26
- </q-icon>
27
- </template>
28
- </q-input>
29
- </template>
30
-
31
- <script lang="ts" setup>
32
- import { defineProps, defineEmits, computed, withDefaults } from 'vue'
33
-
34
- import { ValidationRule, VueClassProp, VueStyleProp } from 'quasar/dist/types/api'
35
-
36
- interface AppQInputProps {
37
- height?: string
38
- name?: string | undefined
39
- mask?: string | undefined
40
- fillMask?: boolean | string | undefined
41
- reverseFillMask?: boolean | undefined
42
- unmaskedValue?: boolean | undefined
43
- modelValue: string | number | null | undefined
44
- error?: boolean | undefined
45
- errorMessage?: string | undefined
46
- noErrorIcon?: boolean | undefined
47
- rules?: ValidationRule[] | undefined
48
- reactiveRules?: boolean | undefined
49
- lazyRules?: boolean | 'ondemand' | undefined
50
- label?: string | undefined
51
- stackLabel?: boolean | undefined
52
- hint?: string | undefined
53
- hideHint?: boolean | undefined
54
- prefix?: string | undefined
55
- suffix?: string | undefined
56
- labelColor?: string | undefined
57
- color?: string | undefined
58
- bgColor?: string | undefined
59
- dark?: boolean | undefined
60
- loading?: boolean | undefined
61
- clearable?: boolean | undefined
62
- clearIcon?: string | undefined
63
- filled?: boolean | undefined
64
- outlined?: boolean | undefined
65
- borderless?: boolean | undefined
66
- bordered?: boolean | undefined
67
- borderRadius?: string | undefined
68
- standout?: boolean | string | undefined
69
- searchIcon?: boolean | undefined
70
- labelSlot?: boolean | undefined
71
- bottomSlots?: boolean | undefined
72
- hideBottomSpace?: boolean | undefined
73
- counter?: boolean | undefined
74
- rounded?: boolean | undefined
75
- square?: boolean | undefined
76
- dense?: boolean | undefined
77
- itemAligned?: boolean | undefined
78
- disable?: boolean | undefined
79
- readonly?: boolean | undefined
80
- autofocus?: boolean | undefined
81
- for?: string | undefined
82
- shadowText?: string | undefined
83
- type?:
84
- | 'text'
85
- | 'password'
86
- | 'textarea'
87
- | 'email'
88
- | 'search'
89
- | 'tel'
90
- | 'file'
91
- | 'number'
92
- | 'url'
93
- | 'time'
94
- | 'date'
95
- | undefined
96
- debounce?: string | number | undefined
97
- maxlength?: string | number | undefined
98
- autogrow?: boolean | undefined
99
- inputClass?: VueClassProp | undefined
100
- inputStyle?: VueStyleProp | undefined
101
- onClear?: (value: any) => void
102
- 'onUpdate:modelValue'?: (value: string | number | null) => void
103
- onFocus?: (evt: Event) => void
104
- onBlur?: (evt: Event) => void
105
- onClick?: (evt: Event) => void
106
- }
107
-
108
- interface AppInputProps extends AppQInputProps {
109
- field?: boolean
110
- required?: boolean
111
- datePicker?: boolean
112
- timePicker?: boolean
113
- dateLocale?: any
114
- withIcon?: boolean
115
- iconName?: string
116
- iconColor?: string
117
- withButton?: boolean
118
- buttonIcon?: string
119
- buttonTooltip?: string
120
- clearTooltip?: string
121
- withArrow?: boolean
122
- }
123
-
124
- const props = withDefaults(defineProps<AppInputProps>(), {
125
- dense: true,
126
- height: '48px',
127
- outlined: true,
128
- error: undefined,
129
- modelValue: '',
130
- borderRadius: '14px',
131
- searchIcon: true,
132
- })
133
-
134
- const emit = defineEmits(['update:modelValue', 'button-click', 'clear', 'focus', 'blur', 'click'])
135
-
136
- const value = computed({
137
- get: () =>
138
- props.modelValue !== null && props.modelValue !== undefined && props.type === 'number'
139
- ? +props.modelValue
140
- : props.modelValue,
141
- set: (newValue: any) => emit('update:modelValue', props.type === 'number' ? +newValue : newValue),
142
- })
143
-
144
- const itemClasses = computed(() => ({
145
- '--dense': props.dense,
146
- '--bordered': props.bordered,
147
- }))
148
- </script>
149
-
150
- <style lang="scss" module>
151
- .app-input {
152
- &:global(.q-field--outlined .q-field__control) {
153
- border-radius: v-bind(borderRadius);
154
- height: v-bind(height);
155
- align-items: center;
156
- padding: 0 12px;
157
- color: #87caff;
158
- }
159
- :global(.q-field__control-container) {
160
- margin-left: 8px;
161
- }
162
- }
163
- @media (max-width: 1440px) {
164
- .app-input {
165
- &:global(.q-field--outlined .q-field__control) {
166
- height: 40px;
167
- padding: 0 12px;
168
- }
169
- :global(.q-field__control-container) {
170
- margin-left: 6px;
171
- }
172
- }
173
- }
174
- </style>
1
+ <template>
2
+ <q-input
3
+ v-model="value"
4
+ standout
5
+ outlined
6
+ clearable
7
+ dense
8
+ bg-color="white"
9
+ :class="[$style['app-input'], itemClasses]"
10
+ :type="type"
11
+ :readonly="readonly || field"
12
+ :placeholder="label"
13
+ >
14
+ <template v-if="searchIcon" #prepend>
15
+ <q-icon>
16
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
17
+ <path
18
+ d="M11.5 21C16.7467 21 21 16.7467 21 11.5C21 6.25329 16.7467 2 11.5 2C6.25329 2 2 6.25329 2 11.5C2 16.7467 6.25329 21 11.5 21Z"
19
+ stroke="#404650"
20
+ stroke-width="1.5"
21
+ stroke-linecap="round"
22
+ stroke-linejoin="round"
23
+ />
24
+ <path d="M22 22L20 20" stroke="#3F8CFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
25
+ </svg>
26
+ </q-icon>
27
+ </template>
28
+ </q-input>
29
+ </template>
30
+
31
+ <script lang="ts" setup>
32
+ import { defineProps, defineEmits, computed, withDefaults } from 'vue'
33
+
34
+ import { ValidationRule, VueClassProp, VueStyleProp } from 'quasar/dist/types/api'
35
+
36
+ interface AppQInputProps {
37
+ height?: string
38
+ name?: string | undefined
39
+ mask?: string | undefined
40
+ fillMask?: boolean | string | undefined
41
+ reverseFillMask?: boolean | undefined
42
+ unmaskedValue?: boolean | undefined
43
+ modelValue: string | number | null | undefined
44
+ error?: boolean | undefined
45
+ errorMessage?: string | undefined
46
+ noErrorIcon?: boolean | undefined
47
+ rules?: ValidationRule[] | undefined
48
+ reactiveRules?: boolean | undefined
49
+ lazyRules?: boolean | 'ondemand' | undefined
50
+ label?: string | undefined
51
+ stackLabel?: boolean | undefined
52
+ hint?: string | undefined
53
+ hideHint?: boolean | undefined
54
+ prefix?: string | undefined
55
+ suffix?: string | undefined
56
+ labelColor?: string | undefined
57
+ color?: string | undefined
58
+ bgColor?: string | undefined
59
+ dark?: boolean | undefined
60
+ loading?: boolean | undefined
61
+ clearable?: boolean | undefined
62
+ clearIcon?: string | undefined
63
+ filled?: boolean | undefined
64
+ outlined?: boolean | undefined
65
+ borderless?: boolean | undefined
66
+ bordered?: boolean | undefined
67
+ borderRadius?: string | undefined
68
+ standout?: boolean | string | undefined
69
+ searchIcon?: boolean | undefined
70
+ labelSlot?: boolean | undefined
71
+ bottomSlots?: boolean | undefined
72
+ hideBottomSpace?: boolean | undefined
73
+ counter?: boolean | undefined
74
+ rounded?: boolean | undefined
75
+ square?: boolean | undefined
76
+ dense?: boolean | undefined
77
+ itemAligned?: boolean | undefined
78
+ disable?: boolean | undefined
79
+ readonly?: boolean | undefined
80
+ autofocus?: boolean | undefined
81
+ for?: string | undefined
82
+ shadowText?: string | undefined
83
+ type?:
84
+ | 'text'
85
+ | 'password'
86
+ | 'textarea'
87
+ | 'email'
88
+ | 'search'
89
+ | 'tel'
90
+ | 'file'
91
+ | 'number'
92
+ | 'url'
93
+ | 'time'
94
+ | 'date'
95
+ | undefined
96
+ debounce?: string | number | undefined
97
+ maxlength?: string | number | undefined
98
+ autogrow?: boolean | undefined
99
+ inputClass?: VueClassProp | undefined
100
+ inputStyle?: VueStyleProp | undefined
101
+ onClear?: (value: any) => void
102
+ 'onUpdate:modelValue'?: (value: string | number | null) => void
103
+ onFocus?: (evt: Event) => void
104
+ onBlur?: (evt: Event) => void
105
+ onClick?: (evt: Event) => void
106
+ }
107
+
108
+ interface AppInputProps extends AppQInputProps {
109
+ field?: boolean
110
+ required?: boolean
111
+ datePicker?: boolean
112
+ timePicker?: boolean
113
+ dateLocale?: any
114
+ withIcon?: boolean
115
+ iconName?: string
116
+ iconColor?: string
117
+ withButton?: boolean
118
+ buttonIcon?: string
119
+ buttonTooltip?: string
120
+ clearTooltip?: string
121
+ withArrow?: boolean
122
+ }
123
+
124
+ const props = withDefaults(defineProps<AppInputProps>(), {
125
+ dense: true,
126
+ height: '48px',
127
+ outlined: true,
128
+ error: undefined,
129
+ modelValue: '',
130
+ borderRadius: '14px',
131
+ searchIcon: true,
132
+ })
133
+
134
+ const emit = defineEmits(['update:modelValue', 'button-click', 'clear', 'focus', 'blur', 'click'])
135
+
136
+ const value = computed({
137
+ get: () =>
138
+ props.modelValue !== null && props.modelValue !== undefined && props.type === 'number'
139
+ ? +props.modelValue
140
+ : props.modelValue,
141
+ set: (newValue: any) => emit('update:modelValue', props.type === 'number' ? +newValue : newValue),
142
+ })
143
+
144
+ const itemClasses = computed(() => ({
145
+ '--dense': props.dense,
146
+ '--bordered': props.bordered,
147
+ }))
148
+ </script>
149
+
150
+ <style lang="scss" module>
151
+ .app-input {
152
+ &:global(.q-field--outlined .q-field__control) {
153
+ border-radius: v-bind(borderRadius);
154
+ height: v-bind(height);
155
+ align-items: center;
156
+ padding: 0 12px;
157
+ color: #87caff;
158
+ }
159
+ :global(.q-field__control-container) {
160
+ margin-left: 8px;
161
+ }
162
+ }
163
+ @media (max-width: 1440px) {
164
+ .app-input {
165
+ &:global(.q-field--outlined .q-field__control) {
166
+ height: 40px;
167
+ padding: 0 12px;
168
+ }
169
+ :global(.q-field__control-container) {
170
+ margin-left: 6px;
171
+ }
172
+ }
173
+ }
174
+ </style>