cacto
f7aa0ba88e
Раньше зона в списке была просто строкой без возможности провалиться внутрь — все устройства смотрелись только через общий плоский список /devices с колонкой "Зона". Теперь клик по зоне открывает её страницу с карточками устройств (иконка по категории, статус online/offline/ unknown точкой с пульсацией для online, external_id) — ровно то, что просили: все устройства и их статус на одном экране при выборе зоны. Заодно список зон переведён с голой таблицы на карточки для консистентности с новой страницей — вся карточка кликабельна и ведёт на show, кнопки изменить/удалить остаются только у owner. ZonePolicy::view уже был публичным (true всем) — новый роут zones.show использует его без изменений.
32 lines
893 B
Vue
32 lines
893 B
Vue
<script setup>
|
|
defineProps({
|
|
status: { type: String, required: true },
|
|
});
|
|
|
|
const dotColor = {
|
|
online: 'bg-green-500',
|
|
offline: 'bg-gray-300',
|
|
unknown: 'bg-yellow-400',
|
|
};
|
|
|
|
const label = {
|
|
online: 'Онлайн',
|
|
offline: 'Офлайн',
|
|
unknown: 'Неизвестно',
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<span class="inline-flex items-center gap-1.5">
|
|
<span class="relative flex h-2.5 w-2.5">
|
|
<span
|
|
v-if="status === 'online'"
|
|
class="absolute inline-flex h-full w-full animate-ping rounded-full opacity-75"
|
|
:class="dotColor[status]"
|
|
/>
|
|
<span class="relative inline-flex h-2.5 w-2.5 rounded-full" :class="dotColor[status] ?? dotColor.unknown" />
|
|
</span>
|
|
<span class="text-xs font-medium text-gray-500">{{ label[status] ?? status }}</span>
|
|
</span>
|
|
</template>
|