yangjl/sh-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

焊接首页

Browse Source
This commit is contained in:
杨家亮
2026-06-10 14:17:54 +08:00
parent d171a5b73b
commit 787ad93dee
24 changed files with 1682 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/page.scss
+207 -1
View File
@@ -26,6 +26,8 @@
// 首页
.home {
padding-top: 80px;
padding-bottom: 60rpx;
.u-border-bottom:after {
border: none;
}
@@ -40,7 +42,9 @@
}
&-icons {
height: 160rpx;
position: fixed;
top: 95px;
height: 80px;
width: 100%;
background-color: $u-type-primary;
display: flex;
@@ -145,4 +149,206 @@
}
}
}
// 快捷应用 & 业务查询公共样式
.section-card {
margin: 20rpx;
background: #fff;
border-radius: 16rpx;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.08);
padding: 24rpx;
.section-title {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 24rpx;
font-size: 28rpx;
font-weight: 600;
color: #333;
.title-left {
display: flex;
align-items: center;
}
.title-line {
display: inline-block;
width: 8rpx;
height: 28rpx;
background: $u-type-primary;
border-radius: 4rpx;
margin-right: 16rpx;
}
.edit-btn {
padding: 8rpx;
opacity: 0.8;
&:active {
opacity: 1;
}
}
}
.section-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24rpx 16rpx;
overflow-x: hidden;
}
.grid-item {
display: flex;
flex-direction: column;
align-items: center;
padding: 16rpx 8rpx;
border-radius: 12rpx;
transition: background 0.2s;
min-width: 0;
&:active {
background: #f5f6f8;
}
.icon-box {
width: 100rpx;
height: 100rpx;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.item-label {
margin-top: 12rpx;
font-size: 22rpx;
color: #666;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
}
}
}
// 编辑快捷应用弹窗样式
.edit-quick {
padding: 32rpx 32rpx 0 32rpx;
height: 100%;
display: flex;
flex-direction: column;
box-sizing: border-box;
.edit-title {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 28rpx;
font-weight: 600;
color: #333;
padding-bottom: 24rpx;
border-bottom: 1rpx solid #f0f0f0;
.edit-tip {
font-size: 24rpx;
color: #999;
font-weight: 400;
}
}
.edit-grid {
width: 100%;
overflow-y: scroll;
display: grid;
grid-template-columns: repeat(4, calc(25% - 20rpx));
gap: 20rpx;
padding: 24rpx 0;
min-height: 0;
box-sizing: border-box;
}
.edit-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
height: 160rpx;
background: #f8f9fa;
border-radius: 16rpx;
position: relative;
transition: all 0.25s;
box-sizing: border-box;
&.active {
background: rgba($color: #4a7df5, $alpha: 0.08);
border: 2rpx solid $u-type-primary;
}
.icon-box {
width: 96rpx;
height: 96rpx;
display: flex;
align-items: center;
justify-content: center;
}
.edit-label {
margin-top: 14rpx;
font-size: 22rpx;
color: #666;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
}
.selected-mark {
position: absolute;
top: 6rpx;
right: 6rpx;
width: 40rpx;
height: 40rpx;
border-radius: 50%;
background: $u-type-primary;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4rpx 12rpx rgba($color: $u-type-primary, $alpha: 0.3);
}
}
.edit-btns {
display: flex;
gap: 24rpx;
padding-top: 20rpx;
padding-bottom: 10rpx;
position: absolute;
bottom: 10px;left:0;right:0;
.u-size-medium {
width: 40%;
}
.btn-cancel,
.btn-confirm {
height: 88rpx;
font-size: 30rpx;
border: none;
&::after {
border: none;
}
}
.btn-cancel {
background: #f5f6f8;
color: #666;
}
.btn-confirm {
box-shadow: 0 4rpx 16rpx rgba($color: $u-type-primary, $alpha: 0.25);
}
}
}
}