找回密码
 立即注册

微信扫码登录

搜索
查看: 1124|回复: 5

[UI界面] 老毕教程之:12123卡片

[复制链接]

27

主题

432

回帖

3285

积分

论坛元老

积分
3285
金钱
2811
HASS币
120
发表于 2025-10-30 13:50:45 | 显示全部楼层 |阅读模式
本帖最后由 flashbj 于 2025-10-30 14:27 编辑

各位大佬们,大家好,这次老毕又来了,这次给大家带来的是12123的卡片。
说明:此帖子只介绍卡片,至于怎么集成12123,可以看@758639304大佬的帖子,https://bbs.hassbian.com/thread-18184-1-1.html

前言:自从上传搞完汽车卡片之后,看着12123的卡片也不顺眼了,就想吧12123的卡片也改改,先看看原来的卡片吧,看着这个卡片就跟前段时间看汽车卡片一样,感觉好low了。

1.jpg

我看了hacs里面现有的卡片样式,没有找到合适的卡片(有可能有,但是我没找到),于是乎我决定自己用AI做一个,经过1周的时间,目前已经完成,先上效果图大家品鉴一下吧。给我
单驾照单车.png
我个人觉得还可以,虽然没有花里胡哨的效果,也不算美观,但是我觉得这个卡片追求的是简洁。不是各位大佬是否同意呢。

好了,言归正传,先介绍一个卡片的功能吧,功能如下:

一、卡片功能介绍:

(一)驾驶证部分
1、显示驾驶证所属人姓名(手动填写,可以填写爱称、外号、真实姓名等)
2、显示驾驶证有效期(审证日期)。
3、根据有效期自动计算距离审证还有多少天,根据天数的不同显示不通的颜色,>90天:绿色、<90天但>30天:蓝色、<30天:橙色、小于0天(超期):红色。
4、显示驾驶证状态,并根据状态区分颜色,正常:绿色、异常:红色。
5、显示驾驶证扣分情况,并根据颜色区分,0-5分:绿色、6-8分:橙色、9分以上:红色。

(二)车辆信息部分
1、显示车牌号,用于家中有多辆车的大佬们区分具体哪个车。
2、显示审车日期。
3、根据审车日期自动计算距离审证还有多少天,根据天数的不同显示不通的颜色,>90天:绿色、<90天但>30天:蓝色、<30天:橙色、小于0天(超期):红色。
4、显示车辆状态,并根据状态区分颜色,正常:绿色、异常:红色。
5、显示未处理的违章数量,并已颜色区分,没有未处理的违章:绿色、有未出的违章:红色。
(三)多驾驶证多车辆介绍
1、因为考虑到多辆车和家里多人有驾驶证的情况,我增加了多驾驶证和多车辆的功能,可以从卡片的可视化配置界面中进行添加,效果图如下:
多驾照多车.jpeg


二、卡片的安装及配置

(一)卡片的安装
此卡片我已经上传到GitHub中了,仓库地址为https://github.com/B361273068/ha-driver-vehicle-card
1、将上述地址添加到HACS的仓库中,类型选择Dashboard,如下图:
2.jpg
2、添加成功后,下载安装此卡片即可。

(二)卡片配置
配置界面如下:
3.jpg 4.jpg

以上就是我用ai生成的卡片,自认为还可以,做的有点粗糙,但是功能还行,有需要的大佬们可以自取!!
回复

使用道具 举报

14

主题

1702

回帖

5763

积分

论坛元老

积分
5763
金钱
4047
HASS币
0
发表于 2025-10-30 15:31:32 | 显示全部楼层
确实粗糙,感谢分享
回复

使用道具 举报

24

主题

198

回帖

3156

积分

论坛技术达人

积分
3156
金钱
2929
HASS币
30
发表于 2025-10-31 23:35:51 | 显示全部楼层
其实我很早之前就换了卡片了 只是一直没发  我放张图吧 好用的话 就放出来
ScreenShot_2025-10-31_233513_696.png
回复

使用道具 举报

24

主题

198

回帖

3156

积分

论坛技术达人

积分
3156
金钱
2929
HASS币
30
发表于 2025-10-31 23:36:22 | 显示全部楼层
758639304 发表于 2025-10-31 23:35
其实我很早之前就换了卡片了 只是一直没发  我放张图吧 好用的话 就放出来  ...

采用button-card写的
回复

使用道具 举报

24

主题

198

回帖

3156

积分

论坛技术达人

积分
3156
金钱
2929
HASS币
30
发表于 2025-10-31 23:43:54 | 显示全部楼层
我的卡片主打一个简单 明了 简简单单的看懂 就好
ScreenShot_2025-10-31_234233_993.png
ScreenShot_2025-10-31_234302_236.png
回复

使用道具 举报

1

主题

138

回帖

1157

积分

金牌会员

积分
1157
金钱
1018
HASS币
0
发表于 2025-11-2 11:42:11 | 显示全部楼层
@758639304 执行怎么扫码了后总是“"ValidationError: "action" is not allowed to be empty"
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|Hassbian ( 晋ICP备17001384号-1 )

GMT+8, 2026-1-16 10:47 , Processed in 0.053585 second(s), 9 queries , MemCached On.

Powered by Discuz! X3.5

© 2001-2026 Discuz! Team.

快速回复 返回顶部 返回列表