From 60029136715367f42734b6f9dd50daf77bf4c113 Mon Sep 17 00:00:00 2001 From: Vce Date: Thu, 13 Jun 2024 16:33:10 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat:=E5=AE=8C=E6=88=90=E7=8E=B0=E5=9C=BA?= =?UTF-8?q?=E5=A4=A7=E5=B1=8F=E4=B8=AD=E4=B8=8B=E5=8F=B3=E9=83=A8=E5=88=86?= =?UTF-8?q?=E8=B4=A8=E9=87=8F=E5=BE=85=E5=8A=9E=E3=80=81=E5=8F=B3=E4=B8=8A?= =?UTF-8?q?=E9=83=A8=E5=88=86=E5=BA=94=E6=80=A5=E8=AE=B0=E5=BD=95=E4=BB=A5?= =?UTF-8?q?=E5=8F=8A=E5=8F=B3=E4=B8=8B=E9=83=A8=E5=88=86=E5=AE=89=E5=85=A8?= =?UTF-8?q?=E5=BE=85=E5=8A=9E=E9=83=A8=E5=88=86=E7=9A=84=E9=9D=99=E6=80=81?= =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=BC=80=E5=8F=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../liveScreen/centerBottomLeft.vue | 4 +- .../liveScreen/centerBottomRight.vue | 61 +++++++++++- .../agjtLiveScreen/liveScreen/rightBottom.vue | 43 +++++++- .../agjtLiveScreen/liveScreen/rightTop.vue | 98 ++++++++++++++++++- 4 files changed, 200 insertions(+), 6 deletions(-) diff --git a/src/views/agjtLiveScreen/liveScreen/centerBottomLeft.vue b/src/views/agjtLiveScreen/liveScreen/centerBottomLeft.vue index fbd74fb..60de84e 100644 --- a/src/views/agjtLiveScreen/liveScreen/centerBottomLeft.vue +++ b/src/views/agjtLiveScreen/liveScreen/centerBottomLeft.vue @@ -113,9 +113,9 @@ import { GlobalStore } from "@/stores"; // justify-content: space-around; .listItem{ width: 100%; - height: 27%; + height: 27.6%; margin-bottom: 10px; - background-color: rgba($color: #062d5a, $alpha: 0.8); + background-color: rgba($color: #062d5a, $alpha: 0.7); font-size: 18px; color: #fff; display: flex; diff --git a/src/views/agjtLiveScreen/liveScreen/centerBottomRight.vue b/src/views/agjtLiveScreen/liveScreen/centerBottomRight.vue index de1ed4a..c71c8c2 100644 --- a/src/views/agjtLiveScreen/liveScreen/centerBottomRight.vue +++ b/src/views/agjtLiveScreen/liveScreen/centerBottomRight.vue @@ -1,7 +1,35 @@ @@ -18,6 +46,37 @@ import { GlobalStore } from "@/stores"; .centerBottomRight { width: 100%; height: 100%; + .mainContainer{ + width: calc(100% - 22px); + height: calc(100% - 26px); + padding: 10px 10px; + .itemBox{ + // width: 100%; + // height: 30%; + border: 1px solid #0c58a2; + color: #fff; + padding: 5px 10px; + margin-bottom: 12px; + box-shadow: inset 0 0 8px 2px rgba($color: #0c58a2, $alpha: 1.0); /* 使用box-shadow属性添加发光效果，参数分别代表向内扩散、水平偏移、垂直偏移、模糊半径、阴影尺寸和颜色 */ + // box-shadow: inset 0 0 5px 2px rgba(255, 255, 255, 0.7); /* 向内发光效果 */ + .itemLine1{ + font-size: 14px; + white-space: nowrap; /* 防止文字换行 */ + overflow: hidden; /* 超出部分隐藏 */ + text-overflow: ellipsis; /* 超出部分显示省略号 */ + } + .itemLine2{ + font-size: 11px; + line-height: 20px; + } + .itemLine3{ + font-size: 11px; + line-height: 20px; + display: flex; + justify-content: space-between; + } + } + } } ::v-deep .h-card .content { height: 80%; diff --git a/src/views/agjtLiveScreen/liveScreen/rightBottom.vue b/src/views/agjtLiveScreen/liveScreen/rightBottom.vue index a55ebbf..4acb0d4 100644 --- a/src/views/agjtLiveScreen/liveScreen/rightBottom.vue +++ b/src/views/agjtLiveScreen/liveScreen/rightBottom.vue @@ -1,7 +1,17 @@ @@ -22,6 +32,37 @@ onMounted( async () => { .rightBottom { width: 100%; height: 100%; + .mainContainer{ + width: calc(100% - 22px); + height: calc(100% - 26px); + padding: 10px 10px; + .itemBox{ + // width: 100%; + // height: 30%; + border: 1px solid #0c58a2; + color: #fff; + padding: 5px 10px; + margin-bottom: 10px; + box-shadow: inset 0 0 8px 2px rgba($color: #0c58a2, $alpha: 1.0); /* 使用box-shadow属性添加发光效果，参数分别代表向内扩散、水平偏移、垂直偏移、模糊半径、阴影尺寸和颜色 */ + // box-shadow: inset 0 0 5px 2px rgba(255, 255, 255, 0.7); /* 向内发光效果 */ + .itemLine1{ + font-size: 14px; + white-space: nowrap; /* 防止文字换行 */ + overflow: hidden; /* 超出部分隐藏 */ + text-overflow: ellipsis; /* 超出部分显示省略号 */ + } + .itemLine2{ + font-size: 11px; + line-height: 20px; + } + .itemLine3{ + font-size: 11px; + line-height: 20px; + display: flex; + justify-content: space-between; + } + } + } } ::v-deep .h-card .content { diff --git a/src/views/agjtLiveScreen/liveScreen/rightTop.vue b/src/views/agjtLiveScreen/liveScreen/rightTop.vue index d5e4311..e5fa9e5 100644 --- a/src/views/agjtLiveScreen/liveScreen/rightTop.vue +++ b/src/views/agjtLiveScreen/liveScreen/rightTop.vue @@ -1,7 +1,50 @@ @@ -17,10 +60,61 @@ onMounted(async () => { }); -