mirror of
https://github.com/xiaoshi930/xiaoshi-pad-card.git
synced 2026-01-13 07:04:59 +00:00
Update xiaoshi-device-todo-button.js
This commit is contained in:
@@ -213,7 +213,6 @@ class XiaoshiTodoButtonEditor extends LitElement {
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label>按钮显示文本
|
||||
<input
|
||||
@@ -246,7 +245,21 @@ class XiaoshiTodoButtonEditor extends LitElement {
|
||||
id="transparent_bg"
|
||||
/>
|
||||
<label for="transparent_bg" class="checkbox-label">
|
||||
透明背景(勾选后按钮背景透明)
|
||||
(平板端特性)透明背景(勾选后按钮背景透明)
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="checkbox-group">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="checkbox-input"
|
||||
@change=${this._entityChanged}
|
||||
.checked=${this.config.lock_white_fg === true}
|
||||
name="lock_white_fg"
|
||||
id="lock_white_fg"
|
||||
/>
|
||||
<label for="lock_white_fg" class="checkbox-label">
|
||||
(平板端特性)白色图标文字(勾选后锁定显示白色)
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@@ -260,7 +273,7 @@ class XiaoshiTodoButtonEditor extends LitElement {
|
||||
id="hide_icon"
|
||||
/>
|
||||
<label for="hide_icon" class="checkbox-label">
|
||||
隐藏图标(勾选后隐藏图标)
|
||||
( 平板端特性)隐藏图标(勾选后隐藏图标)
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@@ -274,7 +287,7 @@ class XiaoshiTodoButtonEditor extends LitElement {
|
||||
id="hide_colon"
|
||||
/>
|
||||
<label for="hide_colon" class="checkbox-label">
|
||||
隐藏冒号(勾选后不显示冒号,改为空格)
|
||||
(平板端特性)隐藏冒号(勾选后不显示冒号,改为空格)
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@@ -288,7 +301,7 @@ class XiaoshiTodoButtonEditor extends LitElement {
|
||||
id="hide_zero"
|
||||
/>
|
||||
<label for="hide_zero" class="checkbox-label">
|
||||
隐藏0值(勾选后数量为0时不显示数量)
|
||||
(平板端特性)隐藏0值(勾选后数量为0时不显示数量)
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@@ -1618,6 +1631,7 @@ class XiaoshiTodoButton extends LitElement {
|
||||
const hideColon = this.config.hide_colon === true;
|
||||
const hideZero = this.config.hide_zero === true;
|
||||
const autoHide = this.config.auto_hide === true;
|
||||
const lockWhiteFg = this.config.lock_white_fg === true;
|
||||
const buttonText = this.config.button_text || '待办';
|
||||
const buttonIcon = this.config.button_icon || 'mdi:clipboard-list';
|
||||
|
||||
@@ -1644,6 +1658,10 @@ class XiaoshiTodoButton extends LitElement {
|
||||
`;
|
||||
} else {
|
||||
// 普通模式
|
||||
// 应用锁定白色功能
|
||||
const iconColor = lockWhiteFg ? 'rgb(255, 255, 255)' : fgColor;
|
||||
const textColor = lockWhiteFg ? 'rgb(255, 255, 255)' : fgColor;
|
||||
|
||||
// 构建显示文本
|
||||
let displayText = buttonText;
|
||||
|
||||
@@ -1663,8 +1681,8 @@ class XiaoshiTodoButton extends LitElement {
|
||||
}
|
||||
|
||||
buttonHtml = html`
|
||||
<div class="todo-status" style="--fg-color: ${fgColor}; --bg-color: ${buttonBgColor};" @click=${this._handleButtonClick}>
|
||||
${!hideIcon ? html`<ha-icon class="status-icon" style="color: ${fgColor};" icon="${buttonIcon}"></ha-icon>` : ''}
|
||||
<div class="todo-status" style="--fg-color: ${textColor}; --bg-color: ${buttonBgColor};" @click=${this._handleButtonClick}>
|
||||
${!hideIcon ? html`<ha-icon class="status-icon" style="color: ${iconColor};" icon="${buttonIcon}"></ha-icon>` : ''}
|
||||
${displayText}
|
||||
</div>
|
||||
`;
|
||||
@@ -1682,7 +1700,17 @@ class XiaoshiTodoButton extends LitElement {
|
||||
`;
|
||||
} else {
|
||||
// 普通模式:显示文本和数量
|
||||
const textColor = totalIncompleteCount === 0 ? fgColor : 'rgb(255, 0, 0)';
|
||||
// 应用锁定白色功能,但预警颜色(红色)不受影响
|
||||
let textColor, iconColor;
|
||||
if (totalIncompleteCount === 0) {
|
||||
// 非预警状态:根据锁定白色设置决定颜色
|
||||
textColor = lockWhiteFg ? 'rgb(255, 255, 255)' : fgColor;
|
||||
iconColor = lockWhiteFg ? 'rgb(255, 255, 255)' : fgColor;
|
||||
} else {
|
||||
// 预警状态:始终使用红色,不受锁定白色影响
|
||||
textColor = 'rgb(255, 0, 0)';
|
||||
iconColor = lockWhiteFg ? 'rgb(255, 255, 255)' : fgColor;
|
||||
}
|
||||
|
||||
// 构建显示文本
|
||||
let displayText = buttonText;
|
||||
@@ -1704,7 +1732,7 @@ class XiaoshiTodoButton extends LitElement {
|
||||
|
||||
buttonHtml = html`
|
||||
<div class="todo-status" style="--fg-color: ${textColor}; --bg-color: ${buttonBgColor};" @click=${this._handleButtonClick}>
|
||||
${!hideIcon ? html`<ha-icon class="status-icon" style="color: ${fgColor};" icon="${buttonIcon}"></ha-icon>` : ''}
|
||||
${!hideIcon ? html`<ha-icon class="status-icon" style="color: ${iconColor};" icon="${buttonIcon}"></ha-icon>` : ''}
|
||||
${displayText}
|
||||
</div>
|
||||
`;
|
||||
|
||||
Reference in New Issue
Block a user