410 lines
7.5 KiB
CSS
410 lines
7.5 KiB
CSS
/* 表单 */
|
|
.uni-forms {
|
|
background-color: #fff !important;
|
|
padding: 10px !important;
|
|
}
|
|
.uni-forms-item {
|
|
margin-bottom: 10px !important;
|
|
}
|
|
.uni-forms-item__label {
|
|
min-width: 80px !important;
|
|
}
|
|
.uni-forms-item__content {
|
|
align-content: center !important;
|
|
}
|
|
|
|
/* 搜索框 */
|
|
.u-search {
|
|
background-color: #fff;
|
|
}
|
|
|
|
.u-search__content__icon .u-icon__icon {
|
|
color: #39ac4f !important;
|
|
}
|
|
|
|
|
|
|
|
/* 徽标数 */
|
|
.u-badge {
|
|
border-radius: 5px !important;
|
|
}
|
|
|
|
.u-badge--not-dot {
|
|
padding: 4px !important;
|
|
}
|
|
|
|
.u-badge--success {
|
|
background-color: #39ac4f !important;
|
|
}
|
|
|
|
/* tabs标签 */
|
|
.u-tabs__wrapper__nav__line {
|
|
background-color: #39ac4f !important;
|
|
}
|
|
|
|
.uni-tag {
|
|
font-weight: normal !important;
|
|
font-size: 0.6rem !important;
|
|
border: none !important;
|
|
}
|
|
|
|
/* 按钮 */
|
|
.u-button--large {
|
|
width: 100% !important;
|
|
height: 38px !important;
|
|
}
|
|
|
|
.u-button--normal {
|
|
height: 28px !important;
|
|
}
|
|
|
|
.u-button--small {
|
|
height: 25px !important;
|
|
}
|
|
|
|
.u-button--mini {
|
|
min-width: 38px !important;
|
|
width: fit-content !important;
|
|
}
|
|
|
|
/* .u-button--success {
|
|
background-color: #39ac4f !important;
|
|
border-color: #39ac4f !important;
|
|
} */
|
|
|
|
.u-button--square {
|
|
border-radius: 5px !important;
|
|
}
|
|
|
|
/* .u-button--plain {
|
|
background-color: transparent !important;
|
|
} */
|
|
|
|
|
|
/* fixed */
|
|
.fixed {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: row;
|
|
}
|
|
|
|
/* 按钮 */
|
|
.btn {
|
|
color: #39ac4f;
|
|
padding: 0 5px;
|
|
border: 1px solid #39ac4f;
|
|
width: fit-content;
|
|
height: 28px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.btn text {
|
|
margin-right: 2px;
|
|
}
|
|
|
|
.btn.active {
|
|
background-color: #39ac4f;
|
|
color: #fff;
|
|
}
|
|
|
|
.btn.activeing {
|
|
background-color: #39ac4f;
|
|
color: #fff;
|
|
}
|
|
|
|
.bottom-btn {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
/* 字体颜色 */
|
|
.font-red {
|
|
color: #e60012;
|
|
}
|
|
|
|
.font-orange {
|
|
color: #ffa200;
|
|
}
|
|
|
|
.font-green {
|
|
color: #39ac4f;
|
|
}
|
|
|
|
/* 背景颜色 */
|
|
.bg-red {
|
|
border-color: #d43030 !important;
|
|
background-color: #d43030 !important;
|
|
}
|
|
|
|
.bg-orange {
|
|
background-color: #e58626 !important;
|
|
}
|
|
|
|
.bg-green {
|
|
background-color: #39ac4f !important;
|
|
}
|
|
|
|
/* 卡片 */
|
|
.card .uni-collapse,
|
|
.card .uni-list,
|
|
.card .uni-list-item {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
::v-deep .card .uni-collapse-item__wrap,.card-zd .uni-collapse-item__wrap {
|
|
border-radius: 0 0 10px 10px;
|
|
}
|
|
|
|
.card,
|
|
.card-grey,.card-zd .uni-collapse-item {
|
|
margin-bottom: 10px;
|
|
background-color: #fff;
|
|
border-radius: 10px;
|
|
box-shadow: 0 1px 9px rgb(209, 209, 209, 0.5);
|
|
}
|
|
.card-zd,.card-zd .uni-collapse{background-color: transparent !important;}
|
|
.card,.card-zd {
|
|
margin: 10px 10px 5px;
|
|
}
|
|
.card-zd .uni-collapse-item{}
|
|
.card-grey {
|
|
background-color: #f3f3f3;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.card-grey .card-title {
|
|
padding: 10px;
|
|
border-bottom: 1px solid #dedede;
|
|
}
|
|
|
|
.card-grey .card-title .icon {
|
|
color: #39ac4f;
|
|
}
|
|
|
|
.card-grey .card-title .u-row {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
|
|
.cards-title {
|
|
padding: 10px;
|
|
border-bottom: 1px solid #dedede;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.cards-title view {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.cards-title view view {
|
|
font-size: 0.8rem;
|
|
}
|
|
|
|
.cards-title view .text {
|
|
font-size: 0.875rem;
|
|
margin-right: 10px;
|
|
color: #39ac4f;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.cards-title .title-r .uni-tag,
|
|
.cards-title .title-r .u-button {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.cards-title .icon {
|
|
color: #39ac4f;
|
|
font-size: 1.3rem;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.cards-content {
|
|
padding: 10px;
|
|
}
|
|
|
|
/* 文字列表 */
|
|
.txt-list {display: flex;}
|
|
.txt-list .list2,.txt-list .list1 {
|
|
color: #666;line-height: 24px;
|
|
flex: 1 1 0%;display: flex;
|
|
flex-wrap: wrap;}
|
|
.txt-list .list1>view {width: 100%;}
|
|
.txt-list .list2>view {width: calc(100% / 2);line-height: 30px;}
|
|
.txt-list .list2 .icon{font-size: 24px; font-weight: normal; vertical-align: bottom;margin-right: 5px; color: #00baad;}
|
|
.txt-list .list2 image{width: 27px;height: 27px;vertical-align: bottom;margin-right: 5px;}
|
|
.txt-list .right {align-content: center;}
|
|
.txt-list .right .iconfont {color: #bbb;}
|
|
/* 灰色条 */
|
|
.greybar {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
grid-template-rows: auto;
|
|
background-color: #f3f3f3;
|
|
padding: 10px;
|
|
border-radius: 4px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.greybar:last-child,
|
|
.greybar-box:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.greybar view>span,
|
|
.greybar-box .title span {
|
|
color: #39ac4f;
|
|
margin-left: 6px;
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.greybar-box {
|
|
background-color: #f3f3f3;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.greybar-box .title {
|
|
padding: 10px;
|
|
border-bottom: 1px solid #c7c7c7;
|
|
display: flex;justify-content: space-between;
|
|
}
|
|
|
|
.greybar>view:first-child,
|
|
.greybar-box .title>view:first-child span {
|
|
color: #00baad;
|
|
}
|
|
|
|
.greybar-box .no-data {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 5px 0;
|
|
color: #a6a6a6;
|
|
font-size: 16px;
|
|
}
|
|
|
|
.greybar-box .no-data .iconfont {
|
|
font-size: 24px;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.card-font {
|
|
height: auto;
|
|
overflow: hidden;
|
|
margin: 10px 0 0 0;
|
|
}
|
|
|
|
.card-font uni-button {
|
|
display: inline-flex;
|
|
float: right;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
.card-view {
|
|
display: flex;
|
|
gap: 5px;
|
|
}
|
|
|
|
.card-view>view {
|
|
flex: 1;
|
|
color: #39ac4f;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.card-view>view .iconfont {
|
|
margin-right: 5px;
|
|
}
|
|
|
|
/* 展示信息 */
|
|
.text-intel {
|
|
width: 100%;
|
|
background-color: #fff;
|
|
padding: 10px;
|
|
display: flex;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.text-intel .iconfont {
|
|
color: #39ac4f;
|
|
font-size: 22px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.text-intel>view {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
.text-intel>view .text {
|
|
font-size: 0.875rem;
|
|
color: #39ac4f;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.tip-intel {
|
|
margin: 5px auto;
|
|
}
|
|
|
|
/* 表单按钮 */
|
|
.form-btn {
|
|
display: flex;
|
|
gap: 10px;
|
|
margin-top: 50px;
|
|
}
|
|
|
|
/* 表单下拉框 */
|
|
.select {
|
|
display: flex;
|
|
box-sizing: border-box;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
border: 1px solid #dcdfe6;
|
|
border-radius: 4px;
|
|
padding-left: 10px;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
height: 35px;
|
|
color: #999;
|
|
}
|
|
|
|
/* grid */
|
|
.grid{margin: 10px; display: grid;grid-template-columns: repeat(3,1fr);gap: 10px;}
|
|
.grid >view{background-color: #fff;border-radius: 10px;text-align: center;padding: 10px 0;}
|
|
.grid >view .text{font-weight: bold; color: #39ac4f;font-size: 16px;position: relative;}
|
|
.grid >view .text:before{content: "";
|
|
width: 100%;height: 4px;position: absolute;bottom: 2px;background-color:rgb(243, 235, 19, 0.5);z-index: 1;border-radius: 10px;}
|
|
.grid >view .u-button{width: 60%; margin-top: 20px;}
|
|
/* btn-grid */
|
|
.btn-grid{margin: 10px 0 0; display: grid;grid-template-columns: repeat(3,1fr);gap: 10px;}
|
|
|
|
/* 表格 */
|
|
.tit {font-size: 14px;text-align: center;padding: 10px;color: #fff;background-color: #2fb980;margin: 10px 10px 0;}
|
|
.table-container {max-height: 55vh;overflow-y: auto; border: 1px solid #EBEEF5;}
|
|
table {background-color: #fff;min-width: 300px;width: 100%;border-collapse: collapse;}
|
|
th,
|
|
td {white-space: nowrap;text-align: center;font-weight: 400;font-size: 14px;color: #606266;padding: 8px 10px;border-left: 1px solid #EBEEF5;border-bottom: 1px solid #EBEEF5;}
|
|
tr:last-child th,
|
|
tr:last-child td {border-bottom: none;}
|
|
tr th:first-child,
|
|
tr td:first-child {border-left: none;}
|
|
th {font-weight: bold;color: #333;background-color: #f5fff9;
|
|
position: -webkit-sticky;
|
|
/* Safari */
|
|
position: sticky;top: 0;z-index: 1;}
|
|
td {background-color: #fff;}
|
|
tr:nth-child(even) td {background-color: #f8f8f8;}
|
|
tr td:first-child,
|
|
tr th:first-child {
|
|
position: -webkit-sticky;
|
|
/* Safari */
|
|
position: sticky;left: 0;z-index: 1;}
|
|
tr th:first-child {z-index: 2;}
|
|
/* 显示数据 */
|
|
.record{padding:5px 10px; background-color: #f3f3f3;margin:0 10px; display: flex; flex-wrap: wrap;gap: 5px;}
|
|
.record > view{width: calc((100% - 10px)/2);} |