js als Tabelle darstellen

chris47803

New member
Im folgenden Script möchte ich die Ausgabe von id:, icon: und suffix: gerne als Tabelle ausgeben.

Code:
  {
    module: 'MMM-ioBroker',
    position: 'top_right',
    header: "     ",   
    config: {
      host: '192.168.2.61',
      port: '8088',
      https: false,
      template: 'MMM-ioBroker.njk',
      devices: [
          { name: 'Küche',
            deviceStates: [
                              { id: '0_userdata.0.Heizung.Kueche',              icon: 'wi wi-thermometer',        suffix: ' °C'},
                              { id: 'fritzdect.0.DECT_099950214189.battery',    icon: 'fa fa-battery-half',       suffix: '%'}                             

                          ]
          },
          
          { name: 'Bad',
            deviceStates: [
                              { id: '0_userdata.0.Heizung.Bad',                 icon: 'wi wi-thermometer',        suffix: ' °C' },
                              { id: 'fritzdect.0.DECT_099950216627.battery',    icon: 'fa fa-battery-half',       suffix: '%'}                               
                            
                          ]
          },
          
          { name: 'Serverraum',
            deviceStates: [
                              { id: '0_userdata.0.Heizung.Serverraum',          icon: 'wi wi-thermometer',        suffix: ' °C' },
                              { id: 'fritzdect.0.DECT_099950273573.battery',    icon: 'fa fa-battery-half',       suffix: '%'}                               
                              
                          ]
          },
          
          { name: 'Schlafzimmer',
            deviceStates: [
                              { id: '0_userdata.0.Heizung.Schlafzimmer',        icon: 'wi wi-thermometer',        suffix: ' °C'},
                              { id: 'fritzdect.0.DECT_099950279527.battery',    icon: 'fa fa-battery-half',       suffix: '%'}                               
                              
                          ]
          },
          
         { name: 'Büro',
            deviceStates: [
                              { id: '0_userdata.0.Heizung.Buero',               icon: 'wi wi-thermometer',        suffix: ' °C' },
                              { id: 'fritzdect.0.DECT_139790667712.battery',    icon: 'fa fa-battery-half',       suffix: '%'}                               
                              
                          ]
          },
          
         { name: 'Wohnzimmer',
            deviceStates: [
                              { id: '0_userdata.0.Heizung.Wohnzimmer',          icon: 'wi wi-thermometer',        suffix: ' °C' },
                              { id: 'fritzdect.0.DECT_099950308576.battery',    icon: 'fa fa-battery-half',       suffix: '%'}                               
                              
                          ]
          },
          
                   { name: 'Aussentemperatur',
            deviceStates: [
                              { id: 'tuya.0.bfa3627a6b9002903fte1v.1',          icon: 'wi wi-thermometer'},
                              { id: 'tuya.0.bfa3627a6b9002903fte1v.2',          icon: 'wi wi-humidity',        suffix: '%' }                                                             
                          ]
          },
          
                   { name: 'AirRobo',
            deviceStates: [
                              { id: 'tuya.0.bfdcea245e055d2c20sj1i.106',        icon: 'fa fa-battery-half',    suffix: '%' }                                                           
                          ]
          },
          
                   { name: 'Briefkasten',
            deviceStates: [
                              { id: 'tuya.0.bf538c2e67ace7ad3eky7f.4',          icon: 'fa fa-battery-half',    suffix: '%' }                                                           
                          ]
          },     
          
                             { name: 'Türspion',
            deviceStates: [
                              { id: 'alias.0.Tuerspion.145',          icon: 'fa fa-battery-half',    suffix: '%' }                                                           
                          ]
          }                 
          
        ]
    }
  },
 
Hi,
probier mal so:

Code:
function createTable(devices) {
  const table = document.createElement('table');
  table.border = '1';

  // Create table header
  const header = table.createTHead();
  const headerRow = header.insertRow();
  const headers = ['ID', 'Icon', 'Suffix'];
  headers.forEach(headerText => {
    const cell = document.createElement('th');
    cell.textContent = headerText;
    headerRow.appendChild(cell);
  });

  // Create table body
  const tbody = table.createTBody();
  devices.forEach(device => {
    device.deviceStates.forEach(state => {
      const row = tbody.insertRow();
      Object.values(state).forEach(text => {
        const cell = row.insertCell();
        cell.innerHTML = text;
      });
    });
  });

  return table;
}

document.body.appendChild(createTable(devices));
 
Code:
const devices = [
  { name: 'Küche',
    deviceStates: [
      { id: '0_userdata.0.Heizung.Kueche', icon: 'wi wi-thermometer', suffix: ' °C'},
      { id: 'fritzdect.0.DECT_099950214189.battery', icon: 'fa fa-battery-half', suffix: '%'}                             
    ]
  },
  ...
];

function createTable(devices) {
...
}
 
Zurück
Oben