doctor-mini/pages/home/index.less
2025-07-03 18:16:00 +08:00

602 lines
12 KiB
Plaintext

@import '/variable.less';
@home-tab-item-height: 96rpx;
.home-container {
position: relative;
height: 100vh;
overflow: hidden;
.home-top-bg {
width: 100%;
height: auto;
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
.hot {
color: #D00F16;
font-size: 36rpx;
margin-bottom: 16rpx;
font-weight: bold;
// margin-top: ;
}
.waring{
color:#ed7b2f ;
}
.success{
color:#00a870;
}
.info {
font-size: 36rpx;
margin-bottom: 16rpx;
font-weight: bold;
}
.group_2 {
overflow-wrap: break-word;
color: rgba(144, 147, 153, 1);
font-size: 24rpx;
font-family: Alibaba-PuHuiTi-R;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
margin: 24rpx 0 0 0;
position: relative;
z-index: 1;
display: flex;
padding: 28rpx;
.box_1 {
border-radius: 100%;
background-image: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/e2d2f77550f64a02bebd425d1db7d2e3_mergeImage.png);
width: 120rpx;
height: 120rpx;
border: 1px solid rgba(248, 248, 248, 1);
display: flex;
flex-direction: column;
}
.text-group_1 {
display: flex;
flex-direction: column;
margin: 16rpx 0 16rpx 24rpx;
}
.text_2 {
overflow-wrap: break-word;
color: rgba(17, 17, 17, 1);
font-size: 36rpx;
font-family: Alibaba-PuHuiTi-M;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 36rpx;
margin-right: 24rpx;
}
.text_3 {
overflow-wrap: break-word;
color: rgba(96, 98, 102, 1);
font-size: 28rpx;
font-family: Alibaba-PuHuiTi-R;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
margin-top: 24rpx;
}
.text_4 {
color: rgba(96, 98, 102, 1);
font-size: 24rpx;
text-align: left;
line-height: 24rpx;
margin: 28rpx 0 0 0rpx;
margin-left: 24rpx;
}
.box_2 {
background-color: rgba(255, 93, 93, 0.000000);
border-radius: 100%;
width: 16rpx;
height: 16rpx;
display: flex;
flex-direction: column;
margin: 16rpx 0 88rpx 250rpx;
}
}
.group_1 {
position: relative;
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
margin: 16rpx 0 16rpx 24rpx;
}
.image_2 {
width: 24rpx;
height: 48rpx;
position: absolute;
top: 4rpx;
left: 0;
z-index: 1;
}
.text_1 {
display: flex;
flex-direction: column;
}
.image_3 {
width: 174rpx;
height: 64rpx;
margin-left: 102rpx;
}
.home-content {
height: calc(100vh - 180rpx);
overflow: scroll;
// padding: 28rpx;
position: relative;
z-index: 1;
.table-group {
background: #F8F8F8;
border-radius: 40rpx 40rpx 0rpx 0rpx;
padding: 28rpx;
}
.text_1 {
font-size: 36rpx;
color: var(--td-text-color);
font-weight: bold;
}
.core-indicators {
.box_2 {
margin-top: 24rpx;
background-color: #fff;
border-radius: 24rpx;
// box-shadow: 0 0 30rpx 0 rgba(0,0,0,0.1);
padding: 40rpx 32rpx;
.box_2_item {
text-align: center;
padding-bottom: 20rpx;
.title {
margin-top: 50rpx;
font-size: 32rpx;
}
.text{
font-size: 24rpx;
color: #606266;
}
// height: 200rpx;
}
.box_3_item {
border-top: 2rpx solid #f5f5f5;
text-align: center;
padding-top: 20rpx;
.text{
font-size: 24rpx;
color: #606266;
}
}
.border-left {
border-left: 2rpx solid #f5f5f5;
}
}
}
.item-title-img {
height: 36rpx;
// width: auto;
}
.item-title-img-2 {
height: 96rpx;
position: relative;
left: -24rpx;
// margin-top: -28rpx;
}
.item-title {
font-family: Alibaba-PuHuiTi, Alibaba-PuHuiTi;
font-weight: normal;
font-size: 36rpx;
color: var(--td-text-color);
line-height: 36rpx;
font-style: normal;
text-transform: none;
margin-bottom: 28rpx;
margin-top: 28rpx;
font-weight: bold;
}
.item-content {
background-color: #fff;
border-radius: 24rpx;
padding: 28rpx;
margin-bottom: 28rpx;
box-shadow: 0rpx 2rpx 20rpx 0rpx rgba(178, 178, 178, 0.05);
.echarts-canvas-container {
width: 100%;
height: 500rpx;
}
.echarts-canvas {
width: 100%;
height: 100%;
}
.echarts-legend {
display: flex;
margin-bottom: 20rpx;
margin-top: 20rpx;
view {
margin-right: 20rpx;
}
.active {
color: #0091cc;
text-decoration: underline;
}
}
.item-title {
position: relative;
.item-title-icon {
vertical-align: middle;
width: 36rpx;
height: 36rpx;
margin-right: 20rpx;
}
.item-title-right-text {
position: absolute;
right: 0;
top: 0;
color: #606266;
font-size: 26rpx;
}
}
.item-content-1-bg {
position: absolute;
z-index: 0;
right: 0;
top: 0;
width: 240rpx;
height: 240rpx;
}
.item-box {
background-color: #fff;
border-radius: 12rpx;
padding: 26rpx;
margin-top: 20rpx;
position: relative;
.item-box-title {
display: flex;
justify-content: space-between;
box-sizing: border-box;
margin-bottom: 20rpx;
.item-box-title-left {
font-size: 28rpx;
color: #323030;
}
.item-box-title-right {
font-size: 24rpx;
color: #949798;
}
}
.drug-name {
font-size: 32rpx;
color: var(--td-text-color);
margin-bottom: 8rpx;
}
.drug-usage {
font-size: 26rpx;
color: #323030;
margin-bottom: 20rpx;
}
.follow-up-itme {
font-size: 28rpx;
color: #909399;
}
.follow-itme-ed {
color: #00B095;
font-size: 32rpx;
position: absolute;
right: 30rpx;
top: 50%;
transform: translateY(-50%);
}
.article-content {
margin-top: 20rpx;
font-size: 28rpx;
color: #606266;
line-height: 44rpx;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
word-break: break-word;
}
}
}
.btn{
width: 100%;
height: 96rpx;
background: #005BA2;
border-radius: 24rpx;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
font-size: 32rpx;
}
.item-content-3 {
padding-left: 0;
padding-right: 0;
background-color: transparent;
.item-box {
// background-color: transparent;
box-shadow: 0rpx 2rpx 20rpx 0rpx rgba(178, 178, 178, 0.05);
border-radius: 24rpx;
}
.item-title-icon {
margin-right: 18rpx;
}
}
.item-content-2 {
background: linear-gradient(180deg, #E7F2F2 0%, #F7FCFC 100%);
box-shadow: 0rpx 2rpx 20rpx 0rpx #E9F4F3;
border-radius: 24rpx;
border: 2rpx solid #FFFFFF;
position: relative;
padding-top: 0;
.item-title {
margin-bottom: 0;
}
.item-box {
margin-top: 0;
}
}
}
.item-content-1 {
background: linear-gradient(180deg, #EDF3F8 0%, #F7FAFC 100%);
box-shadow: 0rpx 2rpx 20rpx 0rpx #EDF3F8;
border-radius: 24rpx;
border: 2rpx solid #FFFFFF;
position: relative;
}
}
.emergency-access {
position: fixed;
right: 40rpx;
bottom: 220rpx;
background-color: red;
color: #fff;
width: 90rpx;
height: 90rpx;
z-index: 9999;
border-radius: 120rpx;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
}
.box_3 {
background-color: rgba(245, 245, 245, 1.000000);
border-radius: 28rpx;
width: 250rpx;
flex-direction: row;
display: flex;
justify-content: space-between;
padding: 4rpx 28rpx 4rpx 4rpx;
white-space: nowrap;
margin-bottom: 16rpx;
margin-left: -4rpx;
}
.text-wrapper_1 {
border-radius: 28rpx;
display: flex;
flex-direction: column;
padding: 12rpx 24rpx 12rpx 24rpx;
}
.text-act {
background-color: rgba(255, 255, 255, 1.000000);
}
.text_2 {
overflow-wrap: break-word;
color: rgba(34, 34, 34, 1);
font-size: 24rpx;
font-family: Alibaba-PuHuiTi-M;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 24rpx;
}
.echarts-title {
font-size: 24rpx;
color: #909399;
line-height: 34rpx;
}
.image-text_3 {
width: 110rpx;
flex-direction: row;
display: flex;
justify-content: space-between;
margin: 32rpx 0rpx 18rpx 0;
}
.box_6 {
border-radius: 100%;
width: 16rpx;
height: 16rpx;
border: 2px solid rgba(0, 91, 162, 1);
display: flex;
flex-direction: column;
margin: 6rpx 0 6rpx 0;
box-sizing: border-box;
}
.text-group_3 {
overflow-wrap: break-word;
color: rgba(34, 34, 34, 1);
font-size: 28rpx;
font-family: Alibaba-PuHuiTi-M;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
}
.box_9 {
background-color: rgba(255, 255, 255, 1.000000);
border-radius: 16rpx;
position: relative;
z-index: 1;
flex-direction: row;
display: flex;
justify-content: flex-center;
padding: 24rpx 24rpx 24rpx 24rpx;
margin-left: 30rpx;
}
.image-text_5 {
width: 298rpx;
flex-direction: row;
display: flex;
justify-content: space-between;
}
.box_10 {
border-radius: 16rpx;
background-image: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/c46fcd8a7c644cbbb347a75b175350c6_mergeImage.png);
width: 100rpx;
height: 100rpx;
border: 1px solid rgba(0, 91, 162, 0.1);
display: flex;
flex-direction: column;
box-sizing: border-box;
margin-right: 16rpx;
}
.text-group_5 {
display: flex;
flex-direction: column;
margin: 12rpx 0 12rpx 0;
}
.text_21 {
overflow-wrap: break-word;
color: rgba(34, 34, 34, 1);
font-size: 32rpx;
font-family: Alibaba-PuHuiTi-M;
white-space: nowrap;
line-height: 32rpx;
margin-right: 86rpx;
}
.text_22 {
overflow-wrap: break-word;
color: rgba(144, 147, 153, 1);
font-size: 28rpx;
font-family: Alibaba-PuHuiTi-R;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
margin-top: 16rpx;
}
.box_11 {
background-color: rgba(237, 243, 248, 1.000000);
width: 2rpx;
height: 62rpx;
display: flex;
flex-direction: column;
margin: 20rpx 0 18rpx 100rpx;
}
.text-wrapper_6 {
border-radius: 32rpx;
display: flex;
flex-direction: column;
margin: 22rpx 0 22rpx 24rpx;
padding: 12rpx 40rpx 12rpx 40rpx;
.text_23 {
color: rgba(0, 91, 162, 1.000000);
}
}
.catArt {
background-color: rgba(0, 91, 162, 1.000000);
.text_23 {
color: #fff;
}
}
.text_23 {
overflow-wrap: break-word;
font-size: 28rpx;
font-family: Alibaba-PuHuiTi-M;
font-weight: normal;
text-align: right;
white-space: nowrap;
line-height: 32rpx;
}