Update xiaoshi-device-update-card.js

README.md

@@ -24,19 +24,12 @@ max: 80                      # 当前地区最大值
 mode: 湿度                   # 【温度】或者【湿度】
 ~~~
 
-## 功能2：HA版本更新卡(手机平板端通用)
+## 功能2：HA信息卡(手机平板端通用)
 **引用示例**
 ~~~
 type: custom:xiaoshi-update-card
 width: 100%
-theme: on
+skip_updates: false    #是否包含已跳过的更新
-~~~
-
-## 功能3：HA离线设备卡(手机平板端通用)
-**引用示例**
-~~~
-type: custom:xiaoshi-offline-card
-width: 100%
 theme: on
 exclude_devices:
   - *设备*
@@ -44,7 +37,7 @@ exclude_entities:
   - *shiti*
 ~~~
 
-## 功能4：电话信息余额卡(手机平板端通用)
+## 功能3：电话信息余额卡(手机平板端通用)
 **引用示例**
 ~~~
 type: custom:xiaoshi-balance-card
@@ -68,7 +61,7 @@ entities:
       warning: "99"
 ~~~
 
-## 功能5：待办事项卡(手机平板端通用)
+## 功能4：待办事项卡(手机平板端通用)
 **引用示例**
 ~~~
 type: custom:xiaoshi-todo-card
@@ -79,7 +72,7 @@ entities:
   - todo.ji_shi_ben
 ~~~
 
-## 功能6：耗材信息卡片(手机平板端通用)
+## 功能5：耗材信息卡片(手机平板端通用)
 **引用示例**
 ~~~
 type: custom:xiaoshi-consumables-card

xiaoshi-device-balance-card.js

@@ -975,12 +975,12 @@ class XiaoshiBalanceCard extends LitElement {
   }
 
   _handleRefresh() {
+    this._handleClick();
     this._loadOilPriceData();
-    navigator.vibrate(50);
   }
 
   _handleEntityClick(entity) {
-    navigator.vibrate(50);
+    this._handleClick();
     // 点击实体时打开实体详情页
     if (entity.entity_id) {
       const evt = new Event('hass-more-info', { composed: true });
@@ -989,6 +989,17 @@ class XiaoshiBalanceCard extends LitElement {
     }
   }
 
+  _handleClick(){
+    if (navigator.vibrate) {
+      navigator.vibrate(50);
+    }
+    else if (navigator.webkitVibrate) {
+        navigator.webkitVibrate(50); 
+    }
+    else {
+    }
+  }
+
   _evaluateWarningCondition(value, condition) {
     if (!condition) return false;
     

xiaoshi-device-consumables-card.js

@@ -74,7 +74,6 @@ class XiaoshiConsumablesCardEditor extends LitElement {
         align-items: center;
         justify-content: space-between;
         padding: 8px 12px;
-        cursor: pointer;
         border-bottom: 1px solid #eee;
       }
 
@@ -452,6 +451,8 @@ class XiaoshiConsumablesCardEditor extends LitElement {
   }
 
   _entityChanged(e) {
+
+    
     const { name, value } = e.target;
     if (!value && name !== 'theme' && name !== 'width' ) return;
     
@@ -905,7 +906,7 @@ class XiaoshiConsumablesCard extends LitElement {
 
       .device-name {
         color: var(--fg-color, #000);
-        font-size: 9px;
+        font-size: 11px;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
@@ -915,13 +916,12 @@ class XiaoshiConsumablesCard extends LitElement {
 
       .device-value {
         color: var(--fg-color, #000);
-        font-size: 9px;
+        font-size: 11px;
         flex-shrink: 0;
         font-weight: bold;
         max-width: 45%;
         text-align: right;
         overflow: hidden;
-        text-overflow: ellipsis;
         white-space: nowrap;
       }
 
@@ -930,7 +930,7 @@ class XiaoshiConsumablesCard extends LitElement {
       }
 
       .device-unit {
-        font-size: 9px;
+        font-size: 11px;
         color: var(--fg-color, #000);
         margin-left: 0.5px;
         font-weight: bold;
@@ -1112,12 +1112,12 @@ class XiaoshiConsumablesCard extends LitElement {
   }
 
   _handleRefresh() {
+    this._handleClick();
     this._loadOilPriceData();
-    navigator.vibrate(50);
   }
 
   _handleEntityClick(entity) {
-    navigator.vibrate(50);
+    this._handleClick();
     // 点击实体时打开实体详情页
     if (entity.entity_id) {
       const evt = new Event('hass-more-info', { composed: true });
@@ -1126,6 +1126,17 @@ class XiaoshiConsumablesCard extends LitElement {
     }
   }
 
+  _handleClick(){
+    if (navigator.vibrate) {
+      navigator.vibrate(50);
+    }
+    else if (navigator.webkitVibrate) {
+        navigator.webkitVibrate(50); 
+    }
+    else {
+    }
+  }
+
   _renderDeviceItem(consumablesData) {
     let isWarning = false;
     
@@ -1265,11 +1276,21 @@ class XiaoshiConsumablesCard extends LitElement {
     const warningCount = this._oilPriceData.filter(consumablesData => {
       let isWarning = false;
       
-      if (consumablesData.warning_threshold && consumablesData.warning_threshold.trim() !== '') {
+      // 对于 binary_sensor 和 event，使用默认预警逻辑
-        isWarning = this._evaluateWarningCondition(consumablesData.value, consumablesData.warning_threshold);
+      if (consumablesData.entity_id.startsWith('binary_sensor.') && !consumablesData.warning_threshold) {
+        // binary_sensor: "缺少"状态时预警
+        isWarning = consumablesData.value === '缺少';
+      } else if (consumablesData.entity_id.startsWith('event.') && !consumablesData.warning_threshold) {
+        // event: "低电量"状态时预警
+        isWarning = consumablesData.value === '低电量';
       } else {
-        if (this.config.global_warning && this.config.global_warning.trim() !== '') {
+        // 使用配置的预警条件
-          isWarning = this._evaluateWarningCondition(consumablesData.value, this.config.global_warning);
+        if (consumablesData.warning_threshold && consumablesData.warning_threshold.trim() !== '') {
+          isWarning = this._evaluateWarningCondition(consumablesData.value, consumablesData.warning_threshold);
+        } else {
+          if (this.config.global_warning && this.config.global_warning.trim() !== '') {
+            isWarning = this._evaluateWarningCondition(consumablesData.value, this.config.global_warning);
+          }
         }
       }
       

xiaoshi-device-offline-card.js

@@ -667,12 +667,12 @@ export class XiaoshiOfflineCard extends LitElement {
   }
 
   _handleRefresh() {
+    this._handleClick();
     this._loadOfflineDevices();
-    navigator.vibrate(50);
   }
 
   _handleDeviceClick(device) {
-    navigator.vibrate(50);
+    this._handleClick();
     // 点击设备时跳转到设备详情页
     if (device.device_id) {
       // 先关闭当前弹窗/界面
@@ -696,7 +696,7 @@ export class XiaoshiOfflineCard extends LitElement {
   }
   
   _handleEntityClick(entity) {
-    navigator.vibrate(50);
+    this._handleClick();
     // 点击实体时打开实体详情页
     if (entity.entity_id) {
       // 使用您建议的第一种方式
@@ -705,7 +705,18 @@ export class XiaoshiOfflineCard extends LitElement {
       this.dispatchEvent(evt);
     }
   }
-  
+
+  _handleClick(){
+    if (navigator.vibrate) {
+      navigator.vibrate(50);
+    }
+    else if (navigator.webkitVibrate) {
+        navigator.webkitVibrate(50); 
+    }
+    else {
+    }
+  }
+
   _closeCurrentDialog() {
     // 查找并关闭当前可能的弹窗或对话框
     const dialogs = document.querySelectorAll('ha-dialog, .mdc-dialog, paper-dialog, vaadin-dialog');

xiaoshi-device-todo-card.js

@@ -941,12 +941,12 @@ class XiaoshiTodoCard extends LitElement {
   }
 
   _handleRefresh() {
+    this._handleClick();
     this._loadTodoData();
-    navigator.vibrate(50);
   }
 
   _handleEntityClick(entity) {
-    navigator.vibrate(50);
+    this._handleClick();
     // 点击实体时打开实体详情页
     if (entity.entity_id) {
       const evt = new Event('hass-more-info', { composed: true });
@@ -955,6 +955,17 @@ class XiaoshiTodoCard extends LitElement {
     }
   }
 
+  _handleClick(){
+    if (navigator.vibrate) {
+      navigator.vibrate(50);
+    }
+    else if (navigator.webkitVibrate) {
+        navigator.webkitVibrate(50); 
+    }
+    else {
+    }
+  }
+
   async _addTodoItem(entityId, item, description = '', due = '') {
     try {
       const params = {
@@ -1082,7 +1093,25 @@ class XiaoshiTodoCard extends LitElement {
                       ${todoData.items.length === 0 ? 
                         html`<div class="no-devices">暂无待办事项</div>` :
                         html`
-                          ${todoData.items.map(item => {
+                          ${(() => {
+                            // 将待办事项分为有时间和无时间两组
+                            const itemsWithoutTime = todoData.items.filter(item => !item.due);
+                            const itemsWithTime = todoData.items.filter(item => item.due);
+                            
+                            // 没有时间的按名称排序
+                            itemsWithoutTime.sort((a, b) => (a.summary || '').localeCompare(b.summary || ''));
+                            
+                            // 有时间的按时间排序
+                            itemsWithTime.sort((a, b) => {
+                              const dateA = new Date(a.due);
+                              const dateB = new Date(b.due);
+                              return dateA - dateB;
+                            });
+                            
+                            // 合并结果：无时间的在前，有时间的在后
+                            const sortedItems = [...itemsWithoutTime, ...itemsWithTime];
+                            
+                            return sortedItems.map(item => {
                             const dueText = this._calculateDueDate(item.due);
                             const isEditing = this._editingItem && this._editingItem.entityId === todoData.entity_id && this._editingItem.uid === item.uid;
                             
@@ -1185,7 +1214,8 @@ class XiaoshiTodoCard extends LitElement {
                                 </button>
                               </div>
                             `;
-                          })}
+                          });
+                          })()}
                         `
                       }
                       <div>

xiaoshi-device-update-card.js

@@ -159,7 +159,6 @@ export class XiaoshiUpdateCard extends LitElement {
         align-items: center;
         padding: 16px;
         background: var(--bg-color, #fff);
-        
         border-radius: 12px;
       }
 
@@ -189,7 +188,6 @@ export class XiaoshiUpdateCard extends LitElement {
         display: flex;
         align-items: center;
         justify-content: center;
-
       }
 
       /*标题统计数字*/
@@ -271,7 +269,8 @@ export class XiaoshiUpdateCard extends LitElement {
         align-items: center;
         padding: 0px;
         border-bottom: 1px solid rgb(150,150,150,0.2);
-        margin: 0 24px 8px 32px;
+        margin: 0 32px 4px 32px;
+        padding: 4px 0 0 0;
       }
 
       /*设备、实体明细背景*/
@@ -279,7 +278,7 @@ export class XiaoshiUpdateCard extends LitElement {
         flex: 1;
         overflow-y: auto;
         min-height: 0;
-        padding: 0 0 8px  0;
+        padding: 4px 0;
       }
 
       .device-icon {
@@ -294,7 +293,7 @@ export class XiaoshiUpdateCard extends LitElement {
       .device-name {
         font-weight: 500;
         color: var(--fg-color, #000);
-        margin-bottom: 4px;
+        margin: 2px 0;
       }
 
       .device-entity {
@@ -306,7 +305,6 @@ export class XiaoshiUpdateCard extends LitElement {
       .device-details {
         font-size: 10px;
         color: var(--fg-color, #000);
-        margin-top: 4px;
       }
 
       .device-last-seen { 
@@ -327,13 +325,13 @@ export class XiaoshiUpdateCard extends LitElement {
 
       .no-devices {
         text-align: center;
-        padding: 8px 0 0 0;
+        padding: 8px 0;
         color: var(--fg-color, #000);
       }
 
       .loading {
         text-align: center;
-        padding: 0px;
+        padding: 10px 0px;
         color: var(--fg-color, #000);
       }
 
@@ -409,12 +407,12 @@ export class XiaoshiUpdateCard extends LitElement {
       /* 备份信息独立容器 */
       .backup-info {
         padding: 4px 0 4px 16px;
-        margin: 0 16px 0 30px;
+        margin: 0 32px 8px 32px;
-        border-bottom: 1px solid rgb(150,150,150,0.2);
         display: grid;
         grid-template-columns: auto auto auto;
         gap: 4px;
         align-items: center;
+        border-bottom: 1px solid rgb(150,150,150,0.2);
       }
     `;
   }
@@ -469,6 +467,28 @@ export class XiaoshiUpdateCard extends LitElement {
     }
   }
 
+  _handleEntityClick(entity) {
+    this._handleClick();
+    // 点击实体时打开实体详情页
+    if (entity.entity_id) {
+      // 使用您建议的第一种方式
+      const evt = new Event('hass-more-info', { composed: true });
+      evt.detail = { entityId: entity.entity_id };
+      this.dispatchEvent(evt);
+    }
+  }
+
+  _handleClick(){
+    if (navigator.vibrate) {
+      navigator.vibrate(50);
+    }
+    else if (navigator.webkitVibrate) {
+        navigator.webkitVibrate(50); 
+    }
+    else {
+    }
+  }
+
   async _loadUpdateData() {
     if (!this.hass) return;
     
@@ -503,6 +523,11 @@ export class XiaoshiUpdateCard extends LitElement {
                   return; // 跳过此更新
                 }
               }
+              // 新增规则：如果skipped_version为null情况下，当latest_version !== installed_version时，
+              // 且实体状态为off时，有可能是安装的版本比latest_version还高，这种不算更新的实体
+              if (attributes.skipped_version === null && entity.state === 'off') {
+                return; // 跳过此更新
+              }
               
               const updateData = {
                 name: attributes.friendly_name || entity.entity_id.replace('update.', ''),
@@ -542,17 +567,13 @@ export class XiaoshiUpdateCard extends LitElement {
     this._loading = false;
   }
 
-
-
   _handleRefresh() {
+    this._handleClick();
     this._loadUpdateData();
-    navigator.vibrate(50);
   }
-
-
   
   _handleUpdateClick(update) {
-    navigator.vibrate(50);
+    this._handleClick();
     // 点击更新项时弹出实体详情
     
     // 如果有entity_id，弹出实体详情
@@ -574,13 +595,17 @@ export class XiaoshiUpdateCard extends LitElement {
   _handleConfirmUpdate(update, event) {
     event.stopPropagation(); // 阻止事件冒泡
     event.preventDefault(); // 阻止默认行为
-    navigator.vibrate(50);
+    this._handleClick();
     
     // 弹出确认对话框
     const confirmed = confirm(`确认要更新 ${update.name} 吗？\n当前版本: ${update.current_version}\n最新版本: ${update.latest_version}`);
     
     if (confirmed) {
       this._executeUpdate(update);
+      // 延迟3秒后刷新数据，给更新操作足够时间完成
+      setTimeout(() => {
+        this._loadUpdateData();
+      }, 1000);
     }
   }
 
@@ -822,19 +847,9 @@ export class XiaoshiUpdateCard extends LitElement {
           ${this._renderHAVersionInfo()}
         </div>
         
-        <!-- 备份信息 -->
-        <div class="section-divider">
-          <div class="section-title">
-            <span> • 备份信息</span>
-          </div>
-        </div>
-        <div class="backup-info">
-          ${this._renderBackupInfo()}
-        </div>
-        
         <div class="devices-list">
           ${this._loading ? 
-            html`<div class="loading">加载中...</div>` :
+            html`<div class="loading">HA版本信息加载中...</div>` :
             
             (this._haUpdates.length === 0 && this._otherUpdates.length === 0) ? 
               html`<div class="no-devices">✅ 所有组件都是最新版本</div>` :
@@ -847,7 +862,7 @@ export class XiaoshiUpdateCard extends LitElement {
                     </div>
                   </div>
                   ${this._haUpdates.map(update => html`
-                    <div class="device-item">
+                    <div class="device-item" @click=${() => this._handleEntityClick(update)}>
                       <div class="device-icon">
                         <ha-icon icon="${update.icon}"></ha-icon>
                       </div>
@@ -867,12 +882,12 @@ export class XiaoshiUpdateCard extends LitElement {
                 ${this._otherUpdates.length > 0 ? html`
                   <div class="section-divider">
                     <div class="section-title">
-                      <span> • 加载项、卡片更新</span>
+                      <span> • HACS更新</span>
                       <span class="section-count ${this._otherUpdates.length > 0 ? 'non-zero' : 'zero'}">${this._otherUpdates.length}</span>
                     </div>
                   </div>
                   ${this._otherUpdates.map(update => html`
-                    <div class="device-item">
+                    <div class="device-item" @click=${() => this._handleEntityClick(update)}>
                       <div class="device-icon">
                         <ha-icon icon="${update.icon}"></ha-icon>
                       </div>
@@ -880,7 +895,7 @@ export class XiaoshiUpdateCard extends LitElement {
                         <div class="device-name">${update.name}</div>
                         <div class="device-details">
                           当前版本: ${update.current_version} → 最新版本: ${update.latest_version}
-                          ${update.skipped_version ? html`<br><span style="color: #ff9800;">已跳过版本: ${update.skipped_version}</span>` : ''}
+                          ${update.skipped_version ? html`<br><span style="color: #ff9800;"> 已跳过版本: ${update.skipped_version}</span>` : ''}
                         </div>
                       </div>
                       <div class="device-last-seen" @click=${(e) => this._handleConfirmUpdate(update, e)}>
@@ -890,8 +905,18 @@ export class XiaoshiUpdateCard extends LitElement {
                   `)}\n                ` : ''}
               `
           }
+
         </div>
-      </ha-card>
+        <!-- 备份信息 -->
+        <div class="section-divider">
+          <div class="section-title">
+            <span> • 备份信息</span>
+          </div>
+        </div>
+        <div class="backup-info">
+          ${this._renderBackupInfo()}
+        </div>
+        </ha-card>
     `;
   }
 

xiaoshi-pad-card.js

@@ -1,12 +1,14 @@
-console.info("%c 消逝卡-平板端 \n%c      v 0.1.2 ", "color: red; font-weight: bold; background: black", "color: white; font-weight: bold; background: black");
+console.info("%c 消逝卡-平板端 \n%c      v 0.1.5 ", "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');
     await import('./xiaoshi-device-todo-card.js');
     await import('./xiaoshi-device-consumables-card.js');
+    await import('./xiaoshi-device-consumables-button.js');
+    await import('./xiaoshi-device-ha-info-card.js'); 
+    await import('./xiaoshi-device-update-card.js');
+    await import('./xiaoshi-device-offline-card.js');
     
     window.customCards = window.customCards || [];
     window.customCards.push(...cardConfigs);
@@ -19,15 +21,9 @@ const cardConfigs = [
     description: '温度分布、湿度分布'
   },
   {
-    type: 'xiaoshi-update-card',
+    type: 'xiaoshi-ha-info-card',
-    name: '消逝卡HA更新监控卡片',
+    name: '消逝卡HA信息卡片',
-    description: '显示需要更新的组件和版本',
+    description: '消逝卡HA信息卡片',
-    preview: true
-  },
-  {
-    type: 'xiaoshi-offline-card',
-    name: '消逝卡HA离线设备卡片',
-    description: '显示所有离线的设备和实体',
     preview: true
   },
   {