первый пост тут так что будь милым! Я постараюсь быть максимально точным и лаконичным из возможных.
В настоящее время я разрабатываю графический интерфейс на Angular / Typescript, который отображает устройства и сетевой трафик в локальной сети и поблизости. Пока что у меня возникли некоторые проблемы с дизайном моего приложения.
У меня есть несколько классов устройств:
Устройство
export class Device {
_id: string
_mac: string
...
}
LANDevice
export class LANDevice extends Device {
_firstSeen: Date
_status: 'reachable' | 'unreachable'
_services: Service[]
...
}
У меня есть другие классы для описания других типов устройств, таких как Bluetooth, устройства BLE и т. Д. Я хотел бы иметь несколько компонентов (Сводка, Сервисы и уязвимости и Активность)который отображает некоторую информацию об этих устройствах.
Проблема, с которой я сталкиваюсь, заключается в том, что в зависимости от типа устройства отображаемая информация будет очень разной.
Как проектировать компонентыи классы для обработки этого варианта использования? Должен ли я иметь функцию в каждом классе устройств для представления «правильной» модели соответствующему компоненту (но мне нужно было бы написать функцию для каждого компонента, поэтому я считаю, что это не очень хорошая идея)
Устройство
export class Device {
...
public toSummary(): SummaryModel {
icon: this._svgIcon(),
name: this._hostname,
content: [
firstSeen: this._firstSeen,
network: [ ... ]
]
}
}
BluetoothDevice
export class Device {
...
public toSummary(): SummaryModel {
icon: this._svgIcon(),
name: this._hostname,
content: [
lastSeen: this._lastSeen,
macVendor: this._macVendor
]
}
}
И в моем компоненте Summary есть:
SummaryComponent
export interface SummaryModel {
icon: <Base64>,
name: string,
content: []
}
export class SummaryComponent {
...
**Parsing of device.toSummary() function with keys/values with table-like display**
**Key1: Value1
**Key2: Value2
**...
}
У кого-нибудь есть идеи получше? Основная проблема заключается в том, что в зависимости от типа устройства я не хочу отображать одни и те же вещи. Я мог бы проверить тип устройства и обработать это в компоненте или HTML, но я считаю, что компонент в Angular должен иметь единый интерфейс / модель данных и обрабатывать только это.
Спасибо за ваше время :)