Update xiaoshi-pad-climate-card.js

xiaoshi-pad-card.js

@@ -1,4 +1,4 @@
-console.info("%c 消逝卡-平板端 \n%c      v 1.0.2 ", "color: red; font-weight: bold; background: black", "color: white; font-weight: bold; background: black");
+console.info("%c 消逝卡-平板端 \n%c      v 1.0.4 ", "color: red; font-weight: bold; background: black", "color: white; font-weight: bold; background: black");
 
 const loadCards = () => {
     import('./xiaoshi-pad-climate-card.js');

xiaoshi-pad-climate-card.js

@@ -681,6 +681,49 @@ class XiaoshiPadClimateCardEditor extends LitElement {
             <option value="off">深色主题（深灰底白字）</option>
           </select>
         </div>
+        
+        <!-- 温度传感器 -->
+        <div class="form-group">
+          <label>温度传感器 (可选)</label>
+          <div class="entity-selector-with-remove">
+            <div class="entity-selector">
+              <input
+                type="text"
+                @input=${this._onTemperatureSearch}
+                @focus=${this._onTemperatureSearch}
+                .value=${this._temperatureSearchTerm || this.config.temperature || ''}
+                placeholder="搜索传感器..."
+                class="entity-search-input"
+              />
+              ${this._showTemperatureList ? html`
+                <div class="entity-dropdown">
+                  ${this._filteredTemperatureEntities.map(entity => html`
+                    <div
+                      class="entity-option ${this.config.temperature === entity.entity_id ? 'selected' : ''}"
+                      @click=${() => this._selectTemperature(entity.entity_id)}
+                    >
+                      <div class="entity-info">
+                        <ha-icon icon="${entity.attributes.icon || 'mdi:help-circle'}"></ha-icon>
+                        <div class="entity-details">
+                          <div class="entity-name">${entity.attributes.friendly_name || entity.entity_id}</div>
+                          <div class="entity-id">${entity.entity_id}</div>
+                        </div>
+                      </div>
+                      ${this.config.temperature === entity.entity_id ?
+                        html`<ha-icon icon="mdi:check" class="check-icon"></ha-icon>` : ''}
+                    </div>
+                  `)}
+                  ${this._filteredTemperatureEntities.length === 0 ? html`
+                    <div class="no-results">未找到匹配的实体</div>
+                  ` : ''}
+                </div>
+              ` : ''}
+            </div>
+            <button class="remove-button" @click=${this._removeTemperature} title="移除温度传感器">
+              <ha-icon icon="mdi:close"></ha-icon>
+            </button>
+          </div>
+        </div>
 
         <!-- 定时器位置 -->
         ${this.config.timer ? html`
@@ -1367,6 +1410,7 @@ class XiaoshiPadClimateCard extends LitElement {
         background: rgb(0,0,0,0);
         cursor: pointer;
         padding: 0;
+        margin: 0;
         display: flex;
         align-items: center;
         justify-content: center;
@@ -1924,7 +1968,7 @@ _renderExtraButtons(buttonType = 1) {
         const domain = buttonEntityId.split('.')[0];
         const friendlyName = entity.attributes.friendly_name || '';
         const displayName = friendlyName.slice(0, 4);
-        const displayValueColor = entity.state === '低' ? 'red' : fgColor;
+        const displayValueColor = entity.state.includes('低') || entity.state.includes('少') || entity.state.includes('缺') ? 'red' : fgColor;
 
         // 根据名称自定义图标
         const _getCustomIcon = (name, isActive) => {
@@ -1934,6 +1978,9 @@ _renderExtraButtons(buttonType = 1) {
             if (name.includes('睡眠')) return isActive ? 'mdi:sleep' : 'mdi:sleep-off';
             if (name.includes('指示灯')) return isActive ? 'mdi:lightbulb-on' : 'mdi:lightbulb-off';
             if (name.includes('提示音')) return isActive ? 'mdi:volume-high' : 'mdi:volume-mute';
+            if (name.includes('防冻')) return isActive ? 'mdi:snowflake' : 'mdi:snowflake-off';
+            if (name.includes('防烫伤')) return isActive ? 'mdi:fire' : 'mdi:fire-off';
+            if (name.includes('按键锁')) return isActive ? 'mdi:lock-open' : 'mdi:lock-open-variant';
             return null;
         };
 
@@ -1963,8 +2010,8 @@ _renderExtraButtons(buttonType = 1) {
 
                 return html`
                     <div class="side-extra-button" style="cursor: default; --bg-color: ${bgColor};">
-                        <div class="side-value" style="color: ${displayValueColor}; font-size: 12px;">${displayValue}</div>
-                        <span class="side-text" style="color: ${buttonColor}">${displayName}</span>
+                        <div class="side-value" style="color: ${displayValueColor}; font-size: 11px; font-weight: bold; white-space: nowrap">${displayValue}</div>
+                        <span class="side-text" style="color: ${fgColor};">${displayName}</span>
                     </div>
                 `;
 
@@ -1974,23 +2021,22 @@ _renderExtraButtons(buttonType = 1) {
                 return html`
                     <button class="side-extra-button"
                             @click=${() => this._handleExtraButtonClick(buttonEntityId, domain)}
-                            style="color: ${buttonColor}; --bg-color: ${bgColor};">
-                        <ha-icon class="side-icon" icon="${buttonIcon}" style="color: ${buttonColor}"></ha-icon>
-                        <span class="side-text" style="color: ${buttonColor}">${displayName}</span>
+                            style="color: ${fgColor}; --bg-color: ${bgColor};">
+                        <ha-icon class="side-icon" icon="${buttonIcon}" style="color: ${fgColor}"></ha-icon>
+                        <span class="side-text" style="color: ${fgColor};">${displayName}</span>
                     </button>
                 `;
 
             case 'select':
-                const options = entity.attributes.options || [];
-                const firstOption = options[0] || '';
-                const selectDisplayValue = firstOption.slice(0, 4);
+                const state = entity.state || '';
+                const selectDisplayValue = state.slice(0, 4);
 
                 return html`
                     <div class="side-extra-button"
                             @click=${() => this._handleExtraButtonClick(buttonEntityId, domain)}
                             style="cursor: default; --bg-color: ${bgColor};">
-                        <div class="side-value" style="color: ${buttonColor}; font-size: 12px;">${selectDisplayValue}</div>
-                        <span class="side-text" style="color: ${buttonColor}">${displayName}</span>
+                        <div class="side-value" style="color: ${fgColor}; font-size: 11px; font-weight: bold; white-space: nowrap">${selectDisplayValue}</div>
+                        <span class="side-text" style="color: ${fgColor};">${displayName}</span>
                     </div>
                 `;