Update xiaoshi-pad-card.js

README.md

@@ -42,3 +42,26 @@ exclude_devices:
 exclude_entities:
   - *shiti*
 ~~~
+
+## 功能4：电话信息余额卡(手机平板端通用)
+**引用示例**
+~~~
+type: custom:xiaoshi-balance-card
+name: 电话余额信息
+width: 350px
+entities:
+  - entity_id: sensor.999
+    attribute: null
+    overrides:
+      icon: ""
+      name: ""
+      unit_of_measurement: ""
+      warning: ""
+  - entity_id: input_boolean.777
+    attribute: friendly_name
+    overrides:
+      name: ""
+      icon: ""
+      unit_of_measurement: ""
+      warning: "99"
+~~~

xiaoshi-device-offline-card.js

@@ -281,7 +281,7 @@ export class XiaoshiOfflineCard extends LitElement {
         align-items: center;
         padding: 0px;
         border-bottom: 1px solid rgb(150,150,150,0.2);
-        margin: 0 32px 8px 32px;
+        margin: 0 32px 0px 32px;
       }
 
       /*设备、实体明细背景*/
@@ -289,7 +289,7 @@ export class XiaoshiOfflineCard extends LitElement {
         flex: 1;
         overflow-y: auto;
         min-height: 0;
-        padding: 0 0 8px  0;
+        padding: 0 0 8px 0;
       }
 
       .device-icon {
@@ -304,7 +304,7 @@ export class XiaoshiOfflineCard extends LitElement {
       .device-name {
         font-weight: 500;
         color: var(--fg-color, #000);
-        margin-bottom: 4px;
+        padding: 6px 0 0 0;
       }
 
       .device-entity {
@@ -316,7 +316,6 @@ export class XiaoshiOfflineCard extends LitElement {
       .device-details {
         font-size: 10px;
         color: var(--fg-color, #000);
-        margin-top: 4px;
       }
 
       .device-last-seen {
@@ -327,7 +326,7 @@ export class XiaoshiOfflineCard extends LitElement {
 
       .no-devices {
         text-align: center;
-        padding: 0px;
+        padding: 8px 0 0 0;
         color: var(--fg-color, #000);
       }
 
@@ -426,6 +425,12 @@ export class XiaoshiOfflineCard extends LitElement {
 
       const offlineDevices = [];
 
+      // 获取设备排除模式
+      const excludeDevicePatterns = this.config.exclude_devices || [];
+      
+      // 记录被排除的设备ID集合
+      const excludedDeviceIds = new Set();
+      
       // 并行检查所有设备
       const deviceChecks = devices.map(device => {
         const deviceEntities = entitiesByDevice[device.id] || [];
@@ -435,12 +440,6 @@ export class XiaoshiOfflineCard extends LitElement {
           isOffline: this._checkDeviceAvailabilitySync(device, deviceEntities, entityMap)
         };
       });
-
-      // 获取设备排除模式
-      const excludeDevicePatterns = this.config.exclude_devices || [];
-      
-      // 记录被排除的设备ID集合
-      const excludedDeviceIds = new Set();
       
       // 过滤离线设备并构建数据
       deviceChecks.forEach(({ device, deviceEntities, isOffline }) => {
@@ -454,16 +453,25 @@ export class XiaoshiOfflineCard extends LitElement {
             return; // 跳过匹配排除模式的设备
           }
           
-          offlineDevices.push({
+          // 再次确保设备有有效实体
-            device_id: device.id,
+          const validEntities = deviceEntities.filter(entityReg => {
-            name: deviceName,
+            const entity = entityMap[entityReg.entity_id];
-            model: device.model,
+            return entity && !entityReg.disabled_by;
-            manufacturer: device.manufacturer,
-            area_id: device.area_id,
-            entities: deviceEntities,
-            last_seen: this._getDeviceLastSeen(deviceEntities, entityMap),
-            icon: this._getDeviceIcon(device, deviceEntities)
           });
+          
+          // 只有当设备有有效实体时才添加到离线设备列表
+          if (validEntities.length > 0) {
+            offlineDevices.push({
+              device_id: device.id,
+              name: deviceName,
+              model: device.model,
+              manufacturer: device.manufacturer,
+              area_id: device.area_id,
+              entities: validEntities, // 使用有效实体而不是所有实体
+              last_seen: this._getDeviceLastSeen(validEntities, entityMap),
+              icon: this._getDeviceIcon(device, validEntities)
+            });
+          }
         }
       });
 
@@ -538,7 +546,7 @@ export class XiaoshiOfflineCard extends LitElement {
 
   _checkDeviceAvailabilitySync(device, deviceEntities, entityMap) {
     if (!deviceEntities || deviceEntities.length === 0) {
-      return true; // 没有实体的设备视为离线
+      return false; // 没有实体的设备不视为离线，直接排除
     }
 
     // 检查设备的可用性状态
@@ -546,16 +554,23 @@ export class XiaoshiOfflineCard extends LitElement {
       return false; // 被禁用的设备不算离线
     }
 
+    // 过滤出有效的实体（未被禁用且在entityMap中存在）
+    const validEntities = deviceEntities.filter(entityReg => {
+      const entity = entityMap[entityReg.entity_id];
+      return entity && !entityReg.disabled_by;
+    });
+
+    // 如果没有有效实体，则不视为离线设备，直接排除
+    if (validEntities.length === 0) {
+      return false;
+    }
+
     let hasAvailableEntity = false;
     let hasUnavailableEntity = false;
 
-    for (const entityReg of deviceEntities) {
+    for (const entityReg of validEntities) {
       const entity = entityMap[entityReg.entity_id];
-      if (!entity) continue;
+      
-
-      // 跳过被禁用的实体
-      if (entityReg.disabled_by) continue;
-
       if (entity.state !== 'unavailable' ) {
         hasAvailableEntity = true;
         break; // 找到一个可用实体就可以停止检查
@@ -564,7 +579,7 @@ export class XiaoshiOfflineCard extends LitElement {
       }
     }
 
-    // 如果设备有实体但所有实体都不可用，则设备离线
+    // 如果设备有有效实体但所有实体都不可用，则设备离线
     return hasUnavailableEntity && !hasAvailableEntity;
   }
 

xiaoshi-device-update-card.js

@@ -307,7 +307,7 @@ export class XiaoshiUpdateCard extends LitElement {
 
       .no-devices {
         text-align: center;
-        padding: 0px;
+        padding: 8px 0 0 0;
         color: var(--fg-color, #000);
       }
 
@@ -342,6 +342,10 @@ export class XiaoshiUpdateCard extends LitElement {
         text-overflow: ellipsis;
       }
 
+      .current-version.outdated {
+        color: rgb(255,20,0);
+      }
+
       .latest-version {
         color: var(--fg-color, #000);
         font-size: 10px;
@@ -690,9 +694,10 @@ export class XiaoshiUpdateCard extends LitElement {
     if (osEntity) {
       const current = osEntity.attributes.installed_version || '未知';
       const latest = osEntity.attributes.latest_version || '未知';
+      const osCurrentVersionClass = (current !== '未知' && latest !== '未知' && current !== latest) ? 'outdated' : '';
       versionElements.push(html`
         <div class="version-label">OS</div>
-        <div class="current-version">当前版本：${current}</div>
+        <div class="current-version ${osCurrentVersionClass}">当前版本：${current}</div>
         <div class="latest-version">最新版本：${latest}</div>
       `);
     }
@@ -702,9 +707,10 @@ export class XiaoshiUpdateCard extends LitElement {
     if (coreEntity) {
       const current = coreEntity.attributes.installed_version || '未知';
       const latest = coreEntity.attributes.latest_version || '未知';
+      const coreCurrentVersionClass = (current !== '未知' && latest !== '未知' && current !== latest) ? 'outdated' : '';
       versionElements.push(html`
         <div class="version-label">Core</div>
-        <div class="current-version">当前版本：${current}</div>
+        <div class="current-version ${coreCurrentVersionClass}">当前版本：${current}</div>
         <div class="latest-version">最新版本：${latest}</div>
       `);
     }
@@ -714,9 +720,10 @@ export class XiaoshiUpdateCard extends LitElement {
     if (supervisorEntity) {
       const current = supervisorEntity.attributes.installed_version || '未知';
       const latest = supervisorEntity.attributes.latest_version || '未知';
+      const supervisorCurrentVersionClass = (current !== '未知' && latest !== '未知' && current !== latest) ? 'outdated' : '';
       versionElements.push(html`
         <div class="version-label">Supervisor</div>
-        <div class="current-version">当前版本：${current}</div>
+        <div class="current-version ${supervisorCurrentVersionClass}">当前版本：${current}</div>
         <div class="latest-version">最新版本：${latest}</div>
       `);
     }

xiaoshi-pad-card.js

@@ -1,9 +1,10 @@
-console.info("%c 消逝卡-平板端 \n%c      v 0.0.1 ", "color: red; font-weight: bold; background: black", "color: white; font-weight: bold; background: black");
+console.info("%c 消逝卡-平板端 \n%c      v 0.0.7 ", "color: red; font-weight: bold; background: black", "color: white; font-weight: bold; background: black");
 
 const loadCards = async () => {
     await import('./xiaoshi-pad-grid-card.js');
     await import('./xiaoshi-device-update-card.js');
     await import('./xiaoshi-device-offline-card.js');
+    await import('./xiaoshi-device-balance-card.js');
     
     window.customCards = window.customCards || [];
     window.customCards.push(...cardConfigs);
@@ -26,6 +27,12 @@ const cardConfigs = [
     name: '消逝卡HA离线设备卡片',
     description: '显示所有离线的设备和实体',
     preview: true
+  },
+  {
+    type: 'xiaoshi-balance-card',
+    name: '消逝电话余额卡',
+    description: '消逝电话余额卡',
+    preview: true
   }
 ];