shared-ritm 1.2.95 → 1.2.96

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.
@@ -1,90 +1,90 @@
1
- import { Api_Status_DTO } from '@/api/types/Api_Tasks'
2
-
3
- export type Api_Video_Source = {
4
- id: string
5
- name: string
6
- login: string
7
- password: string
8
- camera_id: string | null
9
- comment: string | null
10
- data: unknown | null
11
- snapshot_path: string | null
12
- url: string
13
- updated_at: string
14
- created_at: string
15
- fps: string
16
- domed: boolean
17
- height: number
18
- width: number
19
- }
20
-
21
- export type Api_Work_Zone_Search = {
22
- id: string
23
- name: string
24
- title: string
25
- type: number
26
- parent_id: string | null
27
- created_at: string
28
- deleted_at: string | null
29
- updated_at: string
30
- description: string
31
- detect_face: boolean
32
- detect_helmet: boolean
33
- detect_mask: boolean
34
- detect_work_time: boolean
35
- detect_work_zone: boolean
36
- has_tasks: boolean
37
- is_parent: boolean
38
- x0: number
39
- x1: number
40
- y0: number
41
- y1: number
42
- video_source: Api_Video_Source
43
- video_source_id: string
44
- warehouse_by_work_zone_instruments: unknown[]
45
- }
46
-
47
- export type Api_Work_Zone_Usage_User = {
48
- id: string
49
- user_id: string
50
- user_full_name: string
51
- work_zone_id: string
52
- start_interval: string
53
- end_interval: string
54
- minutes: number
55
- }
56
-
57
- export type Api_Work_Zone_Task = {
58
- id: string
59
- name: string
60
- plan_date: string
61
- planned_start: null | string
62
- planned_end: null | string
63
- deadline: string
64
- is_critical_path: boolean | null
65
- is_expired: boolean
66
- power_output_MWh: number
67
- cost_per_MWh: number | null
68
- fact_start_date: null | string
69
- fact_end_date: null | string
70
- time_to_complete_sec: number | null
71
- status: Api_Status_DTO[]
72
- usage_users: Api_Work_Zone_Usage_User[]
73
- }
74
-
75
- export type Api_Work_Zone_Coords = {
76
- x0: number
77
- x1: number
78
- y0: number
79
- y1: number
80
- }
81
-
82
- export type Api_Work_Zone = {
83
- id: string
84
- title: string
85
- created_at: string
86
- video_source: { id: string; name: string }
87
- coordinates: Api_Work_Zone_Coords
88
- warehouse_by_work_zone_instruments: unknown[]
89
- tasks: Api_Work_Zone_Task[]
90
- }
1
+ import { Api_Status_DTO } from '@/api/types/Api_Tasks'
2
+
3
+ export type Api_Video_Source = {
4
+ id: string
5
+ name: string
6
+ login: string
7
+ password: string
8
+ camera_id: string | null
9
+ comment: string | null
10
+ data: unknown | null
11
+ snapshot_path: string | null
12
+ url: string
13
+ updated_at: string
14
+ created_at: string
15
+ fps: string
16
+ domed: boolean
17
+ height: number
18
+ width: number
19
+ }
20
+
21
+ export type Api_Work_Zone_Search = {
22
+ id: string
23
+ name: string
24
+ title: string
25
+ type: number
26
+ parent_id: string | null
27
+ created_at: string
28
+ deleted_at: string | null
29
+ updated_at: string
30
+ description: string
31
+ detect_face: boolean
32
+ detect_helmet: boolean
33
+ detect_mask: boolean
34
+ detect_work_time: boolean
35
+ detect_work_zone: boolean
36
+ has_tasks: boolean
37
+ is_parent: boolean
38
+ x0: number
39
+ x1: number
40
+ y0: number
41
+ y1: number
42
+ video_source: Api_Video_Source
43
+ video_source_id: string
44
+ warehouse_by_work_zone_instruments: unknown[]
45
+ }
46
+
47
+ export type Api_Work_Zone_Usage_User = {
48
+ id: string
49
+ user_id: string
50
+ user_full_name: string
51
+ work_zone_id: string
52
+ start_interval: string
53
+ end_interval: string
54
+ minutes: number
55
+ }
56
+
57
+ export type Api_Work_Zone_Task = {
58
+ id: string
59
+ name: string
60
+ plan_date: string
61
+ planned_start: null | string
62
+ planned_end: null | string
63
+ deadline: string
64
+ is_critical_path: boolean | null
65
+ is_expired: boolean
66
+ power_output_MWh: number
67
+ cost_per_MWh: number | null
68
+ fact_start_date: null | string
69
+ fact_end_date: null | string
70
+ time_to_complete_sec: number | null
71
+ status: Api_Status_DTO[]
72
+ usage_users: Api_Work_Zone_Usage_User[]
73
+ }
74
+
75
+ export type Api_Work_Zone_Coords = {
76
+ x0: number
77
+ x1: number
78
+ y0: number
79
+ y1: number
80
+ }
81
+
82
+ export type Api_Work_Zone = {
83
+ id: string
84
+ title: string
85
+ created_at: string
86
+ video_source: { id: string; name: string }
87
+ coordinates: Api_Work_Zone_Coords
88
+ warehouse_by_work_zone_instruments: unknown[]
89
+ tasks: Api_Work_Zone_Task[]
90
+ }
@@ -1,250 +1,250 @@
1
- <template>
2
- <q-header :class="[$style.header, { [$style[`header-full`]]: fullWidth }]">
3
- <q-toolbar :class="$style.toolbar">
4
- <h1>{{ pageTitle }}</h1>
5
- <div :class="$style['action-buttons']">
6
- <div :class="$style['person']" @click="clickProfile">
7
- <app-icon name="person-icon" />
8
- <div :class="$style['person__info']">
9
- <p style="font-weight: 700; font-size: 14px">{{ shortName }}</p>
10
- <p style="font-weight: 300; font-size: 12px">{{ positionName }}</p>
11
- </div>
12
- </div>
13
- <div :class="$style['action-wrapper']">
14
- <!-- <q-btn :class="$style['notification']" flat padding="sm" :ripple="false" @click="clickNotification">-->
15
- <!-- <app-icon color="white" size="28px" name="notifications-icon" />-->
16
- <!-- </q-btn>-->
17
- <q-separator color="white" vertical size="1px" />
18
- <q-btn
19
- ref="refMenuSettings"
20
- flat
21
- padding="sm"
22
- :ripple="false"
23
- :class="[$style['settings'], { [$style['settings__open']]: isSettingsOpened }]"
24
- @click="openSettingsMenu"
25
- >
26
- <app-icon size="28px" name="setting-icon" />
27
- <q-menu max-height="160px" :offset="[-18, 4]" :class="$style['settings-menu']">
28
- <q-list v-for="item in settingsMenuItems" :key="item.name" :class="$style['settings-menu__list']">
29
- <q-item
30
- v-show="item.isShow"
31
- v-close-popup
32
- :class="$style['settings-menu__item']"
33
- clickable
34
- @click="clickSettingsMenuItem(item)"
35
- >{{ item.label }}</q-item
36
- >
37
- </q-list>
38
- </q-menu>
39
- </q-btn>
40
- </div>
41
-
42
- <!-- <app-button icon="person" text-color="black" :label="shortName" rounded :class="$style['button-person']" />-->
43
- </div>
44
- </q-toolbar>
45
- </q-header>
46
- </template>
47
-
48
- <script lang="ts" setup>
49
- import { computed, defineProps, ref, withDefaults } from 'vue'
50
- import { onClickOutside } from '@vueuse/core'
51
- import AppIcon from '@/common/app-icon/AppIcon.vue'
52
-
53
- interface Props {
54
- userData: any
55
- fullWidth?: boolean
56
- pageTitle?: string
57
- settingsMenuItems?: { label: string; name: string; isShow: boolean }[]
58
- }
59
-
60
- const emits = defineEmits(['clickSettingsMenuItem', 'clickNotification', 'clickProfile'])
61
-
62
- const props = withDefaults(defineProps<Props>(), {
63
- pageTitle: '',
64
- })
65
-
66
- const refMenuSettings = ref(null)
67
- const isSettingsOpened = ref(false)
68
-
69
- // const settingsMenuItems = ref([
70
- // { label: 'Поиск инструментов', name: 'instrument-search', isShow: true },
71
- // { label: 'Мониторинг оборудования', name: 'equipment-monitoring', isShow: true },
72
- // { label: 'Root-режим выключен', name: 'root-off', isShow: true },
73
- // { label: 'Root-режим включен', name: 'root-on', isShow: false },
74
- // ])
75
-
76
- const shortName = computed(() => {
77
- if (!props.userData?.full_name) return ''
78
-
79
- const [lastName, name, patronymic] = props.userData.full_name.split(' ')
80
-
81
- const mainPart = `${lastName} ${name}`
82
-
83
- if (!patronymic) return mainPart
84
-
85
- return `${mainPart} ${patronymic[0]}.`
86
- })
87
-
88
- const positionName = computed(() => props.userData?.positions?.[0]?.display_name)
89
-
90
- const openSettingsMenu = () => {
91
- return (isSettingsOpened.value = !isSettingsOpened.value)
92
- }
93
-
94
- const clickProfile = () => emits('clickProfile')
95
- const clickSettingsMenuItem = (item: any) => emits('clickSettingsMenuItem', item.name)
96
- const clickNotification = () => emits('clickNotification')
97
-
98
- onClickOutside(refMenuSettings, () => (isSettingsOpened.value = false))
99
- </script>
100
-
101
- <style lang="scss" module>
102
- .header {
103
- height: 100px;
104
- background: transparent;
105
- margin: 0 auto;
106
- max-width: 1300px;
107
- }
108
- .header-full {
109
- max-width: 100%;
110
- padding-right: 30px;
111
- padding-left: 30px;
112
- }
113
- .toolbar {
114
- padding: 0;
115
- min-height: 100%;
116
- h1 {
117
- font-weight: 600;
118
- font-size: 28px;
119
- line-height: 100%;
120
- font-family: Montserrat, sans-serif;
121
- }
122
- }
123
-
124
- .header-search {
125
- width: 412px;
126
- font-size: 16px;
127
- }
128
-
129
- .action-buttons {
130
- flex: 1;
131
- position: relative;
132
- display: flex;
133
- align-items: center;
134
- column-gap: 16px;
135
- justify-content: end;
136
- }
137
-
138
- .button {
139
- padding: 12px;
140
- background: white;
141
- transition: all 0.3s ease, color 0.3s ease;
142
- }
143
-
144
- .button-person {
145
- padding: 10px 14px;
146
- background: white;
147
- }
148
-
149
- .person {
150
- display: flex;
151
- align-items: center;
152
- gap: 6px;
153
- padding: 20px 12px;
154
- height: 44px;
155
- border-radius: 10px;
156
- cursor: pointer;
157
- background-color: white;
158
- box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12);
159
- transition: all 0.3s ease;
160
- &__info {
161
- display: flex;
162
- flex-direction: column;
163
- user-select: none;
164
- p {
165
- line-height: 1.2;
166
- margin: 0;
167
- padding: 0;
168
- font-family: 'Nunito Sans', sans-serif;
169
- color: rgb(63, 140, 255);
170
- }
171
- }
172
- &:hover {
173
- background-color: #e1e0e0;
174
- transform: scale(1.01);
175
- }
176
- &:active {
177
- box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3), 0 4px 4px rgba(0, 0, 0, 0.2), 0 6px 2px -5px rgba(0, 0, 0, 0.2);
178
- }
179
- }
180
-
181
- .notification {
182
- cursor: pointer;
183
- transition: transform 0.3s ease;
184
- &:hover {
185
- transform: scale(1.1);
186
- }
187
- :global(.q-focus-helper) {
188
- display: none;
189
- }
190
- }
191
-
192
- .settings {
193
- cursor: pointer;
194
- transition: transform 0.3s ease;
195
- &__open {
196
- transform: rotate(90deg);
197
- }
198
- :global(.q-focus-helper) {
199
- display: none;
200
- }
201
- }
202
-
203
- .settings-menu {
204
- min-width: 210px;
205
- border-radius: 8px;
206
- &__list {
207
- min-width: 210px;
208
- }
209
- &__item {
210
- align-items: center;
211
- font-family: 'Nunito Sans', sans-serif;
212
- color: rgb(63, 140, 255);
213
- }
214
- }
215
-
216
- .action-wrapper {
217
- height: 32px;
218
- justify-content: space-between;
219
- align-items: center;
220
- display: flex;
221
- gap: 12px;
222
- }
223
-
224
- @media (max-width: 1440px) {
225
- .header {
226
- height: 100px;
227
- background: transparent;
228
- margin: 0 auto;
229
- }
230
- .header-search {
231
- width: 343px;
232
- font-size: 16px;
233
- }
234
- .action-buttons {
235
- position: relative;
236
- display: flex;
237
- align-items: center;
238
- column-gap: 8px;
239
- }
240
- .button {
241
- padding: 10px;
242
- background: white;
243
- transition: all 0.3s ease, color 0.3s ease;
244
- }
245
- .button-person {
246
- padding: 8px 10px;
247
- background: white;
248
- }
249
- }
250
- </style>
1
+ <template>
2
+ <q-header :class="[$style.header, { [$style[`header-full`]]: fullWidth }]">
3
+ <q-toolbar :class="$style.toolbar">
4
+ <h1>{{ pageTitle }}</h1>
5
+ <div :class="$style['action-buttons']">
6
+ <div :class="$style['person']" @click="clickProfile">
7
+ <app-icon name="person-icon" />
8
+ <div :class="$style['person__info']">
9
+ <p style="font-weight: 700; font-size: 14px">{{ shortName }}</p>
10
+ <p style="font-weight: 300; font-size: 12px">{{ positionName }}</p>
11
+ </div>
12
+ </div>
13
+ <div :class="$style['action-wrapper']">
14
+ <!-- <q-btn :class="$style['notification']" flat padding="sm" :ripple="false" @click="clickNotification">-->
15
+ <!-- <app-icon color="white" size="28px" name="notifications-icon" />-->
16
+ <!-- </q-btn>-->
17
+ <q-separator color="white" vertical size="1px" />
18
+ <q-btn
19
+ ref="refMenuSettings"
20
+ flat
21
+ padding="sm"
22
+ :ripple="false"
23
+ :class="[$style['settings'], { [$style['settings__open']]: isSettingsOpened }]"
24
+ @click="openSettingsMenu"
25
+ >
26
+ <app-icon size="28px" name="setting-icon" />
27
+ <q-menu max-height="160px" :offset="[-18, 4]" :class="$style['settings-menu']">
28
+ <q-list v-for="item in settingsMenuItems" :key="item.name" :class="$style['settings-menu__list']">
29
+ <q-item
30
+ v-show="item.isShow"
31
+ v-close-popup
32
+ :class="$style['settings-menu__item']"
33
+ clickable
34
+ @click="clickSettingsMenuItem(item)"
35
+ >{{ item.label }}</q-item
36
+ >
37
+ </q-list>
38
+ </q-menu>
39
+ </q-btn>
40
+ </div>
41
+
42
+ <!-- <app-button icon="person" text-color="black" :label="shortName" rounded :class="$style['button-person']" />-->
43
+ </div>
44
+ </q-toolbar>
45
+ </q-header>
46
+ </template>
47
+
48
+ <script lang="ts" setup>
49
+ import { computed, defineProps, ref, withDefaults } from 'vue'
50
+ import { onClickOutside } from '@vueuse/core'
51
+ import AppIcon from '@/common/app-icon/AppIcon.vue'
52
+
53
+ interface Props {
54
+ userData: any
55
+ fullWidth?: boolean
56
+ pageTitle?: string
57
+ settingsMenuItems?: { label: string; name: string; isShow: boolean }[]
58
+ }
59
+
60
+ const emits = defineEmits(['clickSettingsMenuItem', 'clickNotification', 'clickProfile'])
61
+
62
+ const props = withDefaults(defineProps<Props>(), {
63
+ pageTitle: '',
64
+ })
65
+
66
+ const refMenuSettings = ref(null)
67
+ const isSettingsOpened = ref(false)
68
+
69
+ // const settingsMenuItems = ref([
70
+ // { label: 'Поиск инструментов', name: 'instrument-search', isShow: true },
71
+ // { label: 'Мониторинг оборудования', name: 'equipment-monitoring', isShow: true },
72
+ // { label: 'Root-режим выключен', name: 'root-off', isShow: true },
73
+ // { label: 'Root-режим включен', name: 'root-on', isShow: false },
74
+ // ])
75
+
76
+ const shortName = computed(() => {
77
+ if (!props.userData?.full_name) return ''
78
+
79
+ const [lastName, name, patronymic] = props.userData.full_name.split(' ')
80
+
81
+ const mainPart = `${lastName} ${name}`
82
+
83
+ if (!patronymic) return mainPart
84
+
85
+ return `${mainPart} ${patronymic[0]}.`
86
+ })
87
+
88
+ const positionName = computed(() => props.userData?.positions?.[0]?.display_name)
89
+
90
+ const openSettingsMenu = () => {
91
+ return (isSettingsOpened.value = !isSettingsOpened.value)
92
+ }
93
+
94
+ const clickProfile = () => emits('clickProfile')
95
+ const clickSettingsMenuItem = (item: any) => emits('clickSettingsMenuItem', item.name)
96
+ const clickNotification = () => emits('clickNotification')
97
+
98
+ onClickOutside(refMenuSettings, () => (isSettingsOpened.value = false))
99
+ </script>
100
+
101
+ <style lang="scss" module>
102
+ .header {
103
+ height: 100px;
104
+ background: transparent;
105
+ margin: 0 auto;
106
+ max-width: 1300px;
107
+ }
108
+ .header-full {
109
+ max-width: 100%;
110
+ padding-right: 30px;
111
+ padding-left: 30px;
112
+ }
113
+ .toolbar {
114
+ padding: 0;
115
+ min-height: 100%;
116
+ h1 {
117
+ font-weight: 600;
118
+ font-size: 28px;
119
+ line-height: 100%;
120
+ font-family: Montserrat, sans-serif;
121
+ }
122
+ }
123
+
124
+ .header-search {
125
+ width: 412px;
126
+ font-size: 16px;
127
+ }
128
+
129
+ .action-buttons {
130
+ flex: 1;
131
+ position: relative;
132
+ display: flex;
133
+ align-items: center;
134
+ column-gap: 16px;
135
+ justify-content: end;
136
+ }
137
+
138
+ .button {
139
+ padding: 12px;
140
+ background: white;
141
+ transition: all 0.3s ease, color 0.3s ease;
142
+ }
143
+
144
+ .button-person {
145
+ padding: 10px 14px;
146
+ background: white;
147
+ }
148
+
149
+ .person {
150
+ display: flex;
151
+ align-items: center;
152
+ gap: 6px;
153
+ padding: 20px 12px;
154
+ height: 44px;
155
+ border-radius: 10px;
156
+ cursor: pointer;
157
+ background-color: white;
158
+ box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12);
159
+ transition: all 0.3s ease;
160
+ &__info {
161
+ display: flex;
162
+ flex-direction: column;
163
+ user-select: none;
164
+ p {
165
+ line-height: 1.2;
166
+ margin: 0;
167
+ padding: 0;
168
+ font-family: 'Nunito Sans', sans-serif;
169
+ color: rgb(63, 140, 255);
170
+ }
171
+ }
172
+ &:hover {
173
+ background-color: #e1e0e0;
174
+ transform: scale(1.01);
175
+ }
176
+ &:active {
177
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3), 0 4px 4px rgba(0, 0, 0, 0.2), 0 6px 2px -5px rgba(0, 0, 0, 0.2);
178
+ }
179
+ }
180
+
181
+ .notification {
182
+ cursor: pointer;
183
+ transition: transform 0.3s ease;
184
+ &:hover {
185
+ transform: scale(1.1);
186
+ }
187
+ :global(.q-focus-helper) {
188
+ display: none;
189
+ }
190
+ }
191
+
192
+ .settings {
193
+ cursor: pointer;
194
+ transition: transform 0.3s ease;
195
+ &__open {
196
+ transform: rotate(90deg);
197
+ }
198
+ :global(.q-focus-helper) {
199
+ display: none;
200
+ }
201
+ }
202
+
203
+ .settings-menu {
204
+ min-width: 210px;
205
+ border-radius: 8px;
206
+ &__list {
207
+ min-width: 210px;
208
+ }
209
+ &__item {
210
+ align-items: center;
211
+ font-family: 'Nunito Sans', sans-serif;
212
+ color: rgb(63, 140, 255);
213
+ }
214
+ }
215
+
216
+ .action-wrapper {
217
+ height: 32px;
218
+ justify-content: space-between;
219
+ align-items: center;
220
+ display: flex;
221
+ gap: 12px;
222
+ }
223
+
224
+ @media (max-width: 1440px) {
225
+ .header {
226
+ height: 100px;
227
+ background: transparent;
228
+ margin: 0 auto;
229
+ }
230
+ .header-search {
231
+ width: 343px;
232
+ font-size: 16px;
233
+ }
234
+ .action-buttons {
235
+ position: relative;
236
+ display: flex;
237
+ align-items: center;
238
+ column-gap: 8px;
239
+ }
240
+ .button {
241
+ padding: 10px;
242
+ background: white;
243
+ transition: all 0.3s ease, color 0.3s ease;
244
+ }
245
+ .button-person {
246
+ padding: 8px 10px;
247
+ background: white;
248
+ }
249
+ }
250
+ </style>