renkang/xj-screen
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source 
1.更新西安大屏样式
This commit is contained in:
weixin
2024-06-15 13:51:44 +08:00
parent 1adff85a83
commit f6129b7aa4
12 changed files with 138 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/images/positionNew.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

src/assets/images/terminalNew.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

src/assets/images/title-background.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 50 KiB

src/assets/images/top-title-new.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 122 KiB

src/assets/less/index.less
+19 -2
View File
@@ -1,5 +1,6 @@
@import "./amap-item";
@import "./themeType";
@import "./public-title";
.type-time {
padding-right: 4%;
@@ -13,7 +14,7 @@
cursor: pointer;
}
.select {
.select.dark {
color: var(--typeTimeSelectColor);
position: relative;
@@ -30,9 +31,25 @@
}
}
.unSelect {
.unSelect.dark {
color: var(--typeTimeUnSelectColor);
}
.select.light {
color: #5876DB;
background-color: #BDC9F5;
position: relative;
margin-left: 5px;
border: 1px solid #607DDB;
border-radius: 5px;
}
.unSelect.light {
background-color: #BDC9F5;
margin-left: 5px;
color: #889BDB;
border: 1px solid #BDC9F5;
border-radius: 5px;
}
}
*::-webkit-scrollbar {
src/assets/less/public-title.less
+96
View File
@@ -0,0 +1,96 @@
.public-title.dark {
background: linear-gradient(90deg, rgba(106, 112, 124, 0.4) 0%, rgba(106, 112, 124, 0) 70%, rgba(106, 112, 124, 0) 100%);
opacity: 1;
border-top: 1px solid #6a707c;
border-bottom: 1px solid #6a707c;
border-image: linear-gradient(
90deg,
rgba(217.0000022649765, 231.00000143051147, 255, 0.5),
rgba(217.0000022649765, 231.00000143051147, 255, 0)
)
1 1;
color: #ffffff;
&:before {
position: absolute;
content: '';
width: 7px;
height: 100%;
top: 0;
left: 0;
background-color: #45a2ff;
}
.tips {
font-size: 16px;
padding-right: 10px;
font-weight: normal;
}
}
.public-title.light {
background: url("/@/assets/images/title-background.png") no-repeat;
background-size: 100% 100%;
color: #576BAD;
}
.server-item.light {
color: #607DDB;
}
.server-item.dark {
&:nth-child(odd) {
background-color: #0a0a0c;
}
}
.right-top-item.light{
>span:nth-child(1) {
color: #607DDB;
}
>span:nth-child(2) {
color: #F58584;
}
>div {
color: #607DDB;
}
.terminal-icon {
background: url('/@/assets/images/terminalNew.png') no-repeat;
}
.position {
background: url('/@/assets/images/positionNew.png') no-repeat;
}
}
.right-top-item.dark {
.fixed-width {
display: inline-flex;
width: 100px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
span {
color: #ffffff;
font-size: 16px;
}
.terminal-icon {
background: url('/@/assets/images/terminal.png') no-repeat;
}
.position {
background: url('/@/assets/img/position.png') no-repeat;
}
}
.outer-title.light{
color: #576BAD;
background: url('/@/assets/images/top-title-new.png') no-repeat;
}
.outer-title.dark{
color: #ffffff;
background: url('/@/assets/images/top-title.png') no-repeat;
}
src/components/body-d-left/oneL.vue
+12 -28
View File
@@ -1,12 +1,12 @@
<template>
<div class="common-card" :class="[themeType]">
<public-title title="服务详情数据" />
<public-title title="服务详情数据" :themeType="themeType" />
<div class="inner">
<div class="type-time">
<span
v-for="(item, index) in typeTime"
:key="index"
:class="[selectIndex === index ? 'select' : 'unSelect']"
:class="[selectIndex === index ? 'select' : 'unSelect', themeType]"
@click="handleSelect(index, item.value)"
>{{ item.name }}</span
>
@@ -16,7 +16,7 @@
v-for="(item, index) in statistics"
:key="index"
class="server-item"
:class="['gross', 'alerdyreceive'].includes(item.key) ? 'hasCursor' : ''"
:class="[['gross', 'alerdyreceive'].includes(item.key) ? 'hasCursor' : '', themeType]"
@click="handleClick(item)"
>
<span>{{ item?.name }}</span>
@@ -116,7 +116,7 @@
.server-container {
color: #fff;
padding-top: 4%;
padding-top: 10px;
height: 88%;
display: grid;
align-items: start;
@@ -128,34 +128,18 @@
left: 50%;
top: 50%;
}
}
.server-item {
font-size: 16px;
padding: 6px 0;
.server-item {
font-size: 16px;
padding: 6px 6% 6px 5%;
&.hasCursor {
cursor: pointer;
}
span {
display: inline-block;
width: 50%;
}
span:nth-child(1) {
text-align: left;
padding-left: 5%;
}
span:nth-child(2) {
text-align: right;
padding-right: 6%;
}
&.hasCursor {
cursor: pointer;
}
.server-item:nth-child(odd) {
background-color: #0a0a0c;
}
display: flex;
justify-content: space-between;
}
}
</style>
src/components/body-d-right/oneR.vue
+5 -19
View File
@@ -7,7 +7,7 @@
</public-title>
<div class="inner">
<vue3-seamless-scroll :list="scrollList" class="scroll" :hover="true" :limitScrollNum="4" v-bind="classOption">
<div class="item" v-for="(item, i) in scrollList" :key="i">
<div class="item right-top-item" :class="themeType" v-for="(item, i) in scrollList" :key="i">
<span class="fixed-width" :title="item?.realName">{{ item?.realName }}</span>
<span class="fixed-width" :title="item?.eventType_dictText">{{ item?.eventType_dictText }}</span>
<div class="time-icon">
@@ -168,19 +168,6 @@
justify-content: space-between;
padding: 3% 0;
.fixed-width {
display: inline-flex;
width: 100px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
span {
color: #ffffff;
font-size: 16px;
}
.time-icon {
display: flex;
align-items: center;
@@ -191,18 +178,16 @@
display: inline-block;
width: 18px;
height: 18px;
background: url('/@/assets/images/terminal.png') no-repeat;
background-size: 100% 100%;
cursor: pointer;
}
.position {
width: 18px;
height: 18px;
background-size: 100% 100%;
margin-left: 5px;
display: inline-block;
width: 20px;
height: 20px;
background: url('/@/assets/img/position.png') no-repeat;
background-size: 100% 100%;
cursor: pointer;
}
}
@@ -214,6 +199,7 @@
.con-item {
padding: 1.3% 0;
display: flex;
span:nth-child(1) {
font-weight: bold;
src/components/body-d-right/threeR.vue
+1 -1
View File
@@ -1,6 +1,6 @@
<template>
<div class="common-card" :class="themeType">
<public-title title="基层医疗点远程会诊" />
<public-title title="基层医疗点远程会诊" :theme-type="themeType" />
<div class="inner">
<div class="inner-item" data-text="应急就医-服务中心"></div>
<div class="inner-item" data-text="采油九厂-薛岔作业区"></div>
src/components/publicTitle.vue
+3 -29
View File
@@ -1,7 +1,7 @@
<template>
<div class="title-d">
<div class="title-d public-title" :class="props.themeType">
<span>{{ props.title }}</span>
<div>
<div v-if="props.themeType !== 'light'">
<span class="tips"><slot name="right"></slot></span>
<img src="../assets/img/point.png" alt="" />
</div>
@@ -34,36 +34,10 @@
text-align: left;
height: 40px;
line-height: 40px;
background: linear-gradient(90deg, rgba(106, 112, 124, 0.4) 0%, rgba(106, 112, 124, 0) 70%, rgba(106, 112, 124, 0) 100%);
opacity: 1;
border-top: 1px solid #6a707c;
border-bottom: 1px solid #6a707c;
border-image: linear-gradient(
90deg,
rgba(217.0000022649765, 231.00000143051147, 255, 0.5),
rgba(217.0000022649765, 231.00000143051147, 255, 0)
)
1 1;
color: #ffffff;
font-size: 20px;
font-weight: 700;
display: flex;
justify-content: space-between;
&:before {
position: absolute;
content: '';
width: 7px;
height: 100%;
top: 0;
left: 0;
background-color: #45a2ff;
}
.tips {
font-size: 16px;
padding-right: 10px;
font-weight: normal;
}
}
</style>
src/views/index.vue
+1 -3
View File
@@ -1,6 +1,6 @@
<template>
<div class="outer">
<div class="title-d">
<div class="title-d outer-title" :class="themeType">
<div class="title-d-left">
{{ dayTimeO }}
</div>
@@ -329,14 +329,12 @@
line-height: 80px;
display: flex;
padding-bottom: 9px;
background: url('/@/assets/images/top-title.png') no-repeat;
background-size: 100% 100%;
.title-d-left,
.title-d-middle,
.title-d-right {
font-size: 27px;
color: #ffffff;
line-height: 60px;
text-align: center;
}