From 575774df8b503c23651c591a818191cc42068924 Mon Sep 17 00:00:00 2001 From: fangxiang Date: Wed, 18 May 2022 18:41:42 +0800 Subject: [PATCH] =?UTF-8?q?=E6=97=B6=E9=92=9F=E8=AE=BE=E7=BD=AE=E5=AF=B9?= =?UTF-8?q?=E8=AF=9D=E6=A1=86=E5=A2=9E=E5=8A=A0=E6=96=B0=E5=A2=9E=E5=AD=97?= =?UTF-8?q?=E6=AE=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- src/components/AboutDialog.vue | 29 +- src/components/ClockSignalSourceDialog.vue | 451 ++++++++++++++++++--- src/entities/ClockWindowParamEntity.ts | 13 + src/i18n/zh-CN/index.ts | 16 + 5 files changed, 428 insertions(+), 83 deletions(-) diff --git a/package.json b/package.json index 4f49698..f9d1a56 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "media_player_client", - "version": "1.4.6", + "version": "1.4.7", "description": "A Quasar Framework app", "productName": "MediaPlayerClient", "author": "fangxiang ", diff --git a/src/components/AboutDialog.vue b/src/components/AboutDialog.vue index 9616c89..3c9689d 100644 --- a/src/components/AboutDialog.vue +++ b/src/components/AboutDialog.vue @@ -51,13 +51,21 @@ >{{ $t("server version") }}: {{ server_version }} - + {{ $t("server commit hash") }}: {{ server_commit_hash }} -
+
{{ $t("server branch name") }}: @@ -83,16 +91,6 @@ >
- - - - @@ -130,12 +128,6 @@ export default defineComponent({ let kernel_version = ref("unknow"); let rootfs_version = ref("unknow"); - const restart_device = () => { - GlobalData.getInstance() - .getCurrentClient() - ?.restartDevice(1000 * 5); - }; - return { show_dialog, click_count, @@ -148,7 +140,6 @@ export default defineComponent({ kernel_version, rootfs_version, - restart_device, async showDialog() { click_count.value = 0; show_dialog.value = true; diff --git a/src/components/ClockSignalSourceDialog.vue b/src/components/ClockSignalSourceDialog.vue index b271ae4..ba1e052 100644 --- a/src/components/ClockSignalSourceDialog.vue +++ b/src/components/ClockSignalSourceDialog.vue @@ -38,10 +38,7 @@ - + @@ -52,13 +49,188 @@ - - {{ $t("font size") }} + + + + {{ $t("clock type") }} + + + + + + - + + + {{ $t("font size") }} + + + + + - + + + + + + {{ $t("font color") }} + + + + + + + + + + + + {{ $t("background color") }} + + + + + + + + + + + + + + {{ $t("date format") }} + + + + + + + + + + + + {{ $t("time format") }} + + + + + + + + + + + + + {{ $t("text") }} + + + + + + + + {{ + $t( + "the current property is only valid for single-line displays" + ) + }} + + + + + + + + + + + + + + + + + + - - - {{ $t("font color") }} - - - - - - - - - - {{ $t("background color") }} - - - - - - - - - - +
+ + + + + + + + + + + + + + + + + + + + + + + + +
@@ -148,7 +389,11 @@ @@ -156,7 +401,7 @@ import { defineComponent, ref, Ref, watch, computed } from "vue"; import { useStore } from "src/store"; import GlobalData from "src/common/GlobalData"; -import { useQuasar } from "quasar"; +import { useQuasar, date as DateHelper } from "quasar"; import { useI18n } from "vue-i18n"; import ClockWindowParamEntity from "src/entities/ClockWindowParamEntity"; @@ -169,6 +414,33 @@ export default defineComponent({ let $q = useQuasar(); let $t = useI18n(); + const now = Date.now(); + const date_format_options = ref([ + { + label: DateHelper.formatDate(now, "YYYY年MM月DD日"), + value: "yyyy年MM月dd日", + }, + { + label: DateHelper.formatDate(now, "YYYY/MM/DD"), + value: "yyyy/MM/dd", + }, + { + label: DateHelper.formatDate(now, "YYYY-MM-DD"), + value: "yyyy-MM-dd", + }, + ]); + + const time_format_options = ref([ + { + label: DateHelper.formatDate(now, "HH时mm分ss秒"), + value: "hh时mm分ss秒", + }, + { + label: DateHelper.formatDate(now, "HH:mm:ss"), + value: "hh:mm:ss", + }, + ]); + let show_dialog = ref(false); let loading = ref(false); @@ -191,6 +463,9 @@ export default defineComponent({ show_dialog, loading, clock_entity, + date_format_options, + time_format_options, + showDialogAsync(options: any) { if (_resolove) { _resolove(); @@ -227,6 +502,56 @@ export default defineComponent({ } catch {} loading.value = false; }, + getForegroundColor(color: string) { + // rgbToHex(0, 51, 255) => "#0033ff" + function rgbToHex(r: any, g: any, b: any) { + return ( + "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1) + ); + } + + //hexToRgb("#0033ff") => {r: 0, g: 51, b: 255} + //hexToRgb("#0033ff").g => 51 + function hexToRgb(hex: any) { + // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF") + var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i; + hex = hex.replace( + shorthandRegex, + function (m: any, r: any, g: any, b: any) { + return r + r + g + g + b + b; + } + ); + + var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); + return result + ? { + r: parseInt(result[1], 16), + g: parseInt(result[2], 16), + b: parseInt(result[3], 16), + } + : null; + } + + //灰度 = 红×0.299 + 绿×0.587 + 蓝×0.114 + function getGrayLevelFromRgb(r: any, g: any, b: any) { + return (0.299 * r + 0.587 * g + 0.114 * b) / 255; + } + + // getGrayLevel('#167df0') => 0.4208352941176471 + function getGrayLevel(hex: any) { + var rgb = hexToRgb(hex); + if (rgb) { + return getGrayLevelFromRgb(rgb.r, rgb.g, rgb.b); + } + return "#000000"; + } + + function getColor(background_color: any) { + var grayLevel = getGrayLevel(background_color); + return grayLevel > 0.5 ? "#000000b3" : "#fff"; + } + return getColor(color ?? "#000000"); + }, }; }, }); diff --git a/src/entities/ClockWindowParamEntity.ts b/src/entities/ClockWindowParamEntity.ts index 96cedca..f5db8e2 100644 --- a/src/entities/ClockWindowParamEntity.ts +++ b/src/entities/ClockWindowParamEntity.ts @@ -7,4 +7,17 @@ export default class ClockWindowParamEntity { font_color = "#000000"; background_color = "#000000"; background_transparent = true; + + date_format = "yyyy/MM/dd"; + time_format = "hh:mm:ss"; + show_date = true; + show_time = true; + show_week = true; + analog_minute_color = "#ff0000"; + analog_minute_pointer_color = "#00ff00"; + analog_second_color = "#00ff00"; + analog_second_pointer_color = "#0000ff"; + analog_hour_pointer_color = "#ff0000"; + text = ""; + multiple_lines = false; } diff --git a/src/i18n/zh-CN/index.ts b/src/i18n/zh-CN/index.ts index 6a0cbfa..a1c1f40 100644 --- a/src/i18n/zh-CN/index.ts +++ b/src/i18n/zh-CN/index.ts @@ -514,4 +514,20 @@ export default { "lossless ": "无损", "picture quality": "画质", set: "设置", + "time format": "时间格式", + "date format": "日期格式", + "multiple lines": "多行", + week: "星期", + date: "日期", + "normal clock": "普通时钟", + "analog clock": "模拟时钟", + "clock type": "时钟类型", + text: "文本", + "hour pointer color": "时针", + "minute pointer color": "分针", + "second pointer color": "秒针", + "minute mark color": "分标", + "second mark color": "秒标", + "the current property is only valid for single-line displays": + "当前属性只对单行显示有效", };