useBattery.ts 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. import { computed, onMounted, reactive, toRefs } from 'vue';
  2. interface Battery {
  3. charging: boolean; // 当前电池是否正在充电
  4. chargingTime: number; // 距离充电完毕还需多少秒,如果为0则充电完毕
  5. dischargingTime: number; // 代表距离电池耗电至空且挂起需要多少秒
  6. level: number; // 代表电量的放大等级,这个值在 0.0 至 1.0 之间
  7. [key: string]: any;
  8. }
  9. export const useBattery = () => {
  10. const state = reactive({
  11. battery: {
  12. charging: false,
  13. chargingTime: 0,
  14. dischargingTime: 0,
  15. level: 100,
  16. } as any,
  17. });
  18. // 更新电池使用状态
  19. const updateBattery = (target: any) => {
  20. for (const key in state.battery) {
  21. state.battery[key] = target[key];
  22. }
  23. state.battery.level = state.battery.level * 100;
  24. };
  25. // 计算电池剩余可用时间
  26. const calcDischargingTime = computed(() => {
  27. const hour = state.battery.dischargingTime / 3600;
  28. const minute = (state.battery.dischargingTime / 60) % 60;
  29. return `${~~hour}小时${~~minute}分钟`;
  30. });
  31. // 计算电池充满剩余时间
  32. const calcChargingTime = computed(() => {
  33. console.log(state.battery);
  34. const hour = state.battery.chargingTime / 3600;
  35. const minute = (state.battery.chargingTime / 60) % 60;
  36. return `${~~hour}小时${~~minute}分钟`;
  37. });
  38. // 电池状态
  39. const batteryStatus = computed(() => {
  40. if (state.battery.charging && state.battery.level >= 100) {
  41. return '已充满';
  42. } else if (state.battery.charging) {
  43. return '充电中';
  44. } else {
  45. return '已断开电源';
  46. }
  47. });
  48. onMounted(async () => {
  49. const BatteryManager: Battery = await (window.navigator as any).getBattery();
  50. updateBattery(BatteryManager);
  51. // 电池充电状态更新时被调用
  52. BatteryManager.onchargingchange = ({ target }: any) => {
  53. updateBattery(target);
  54. };
  55. // 电池充电时间更新时被调用
  56. BatteryManager.onchargingtimechange = ({ target }: any) => {
  57. updateBattery(target);
  58. };
  59. // 电池断开充电时间更新时被调用
  60. BatteryManager.ondischargingtimechange = ({ target }: any) => {
  61. updateBattery(target);
  62. };
  63. // 电池电量更新时被调用
  64. BatteryManager.onlevelchange = ({ target }: any) => {
  65. updateBattery(target);
  66. };
  67. // new Intl.DateTimeFormat('zh', {
  68. // year: 'numeric',
  69. // month: '2-digit',
  70. // day: '2-digit',
  71. // hour: '2-digit',
  72. // minute: '2-digit',
  73. // second: '2-digit',
  74. // hour12: false
  75. // }).format(new Date())
  76. });
  77. return {
  78. ...toRefs(state),
  79. batteryStatus,
  80. calcDischargingTime,
  81. calcChargingTime,
  82. };
  83. };