Skip to content

梁建民 / wmsApp

Go to a project
Commit 38486012 by liangjianmin
Options

style(arrivalRegister): 更新样式以提升用户界面一致性和可读性 

- 调整了到货登记页面的样式，增加了内边距和字体大小，提升了整体视觉效果
- 统一了多个组件的颜色和布局，增强了用户体验
- 优化了按钮和输入框的样式，确保一致性和可用性
parent b76303e8
Inline Side-by-side
Showing with 106 additions and 0 deletions
assets/css/arrivalRegister/index.scss
.arrivalRegister { .arrivalRegister {
padding: 15rpx 22rpx; padding: 15rpx 22rpx;
.radio-search-box { .radio-search-box {
height: 57rpx; height: 57rpx;
.total-text { .total-text {
font-size: 16rpx; font-size: 16rpx;
color: #919399; color: #919399;
text { text {
padding: 0 5rpx; padding: 0 5rpx;
color: #1969f9; color: #1969f9;
} }
} }
} }
.search-all { .search-all {
height: 60rpx; height: 60rpx;
.search-all-box { .search-all-box {
height: 60rpx; height: 60rpx;
padding-left: 17rpx; padding-left: 17rpx;
background: #ffffff; background: #ffffff;
border-radius: 10rpx; border-radius: 10rpx;
} }
.icon-juxing1 { .icon-juxing1 {
font-size: 30rpx; font-size: 30rpx;
color: #919399; color: #919399;
} }
.icon-a-juxing11 { .icon-a-juxing11 {
font-size: 30rpx; font-size: 30rpx;
color: #c6c7cc; color: #c6c7cc;
width: 60rpx; width: 60rpx;
text-align: center; text-align: center;
} }
.uni-input { .uni-input {
width: 465rpx; width: 465rpx;
font-size: 18rpx; font-size: 18rpx;
...@@ -36,23 +44,29 @@ ...@@ -36,23 +44,29 @@
margin-left: 13rpx; margin-left: 13rpx;
} }
} }
.print-btn { .print-btn {
font-size: 23rpx; font-size: 23rpx;
color: #1969f9; color: #1969f9;
} }
.preCheck { .preCheck {
margin-top: 15rpx; margin-top: 15rpx;
.t1 { .t1 {
font-size: 18rpx; font-size: 18rpx;
color: #292b33; color: #292b33;
} }
.t2 { .t2 {
font-size: 19rpx; font-size: 19rpx;
color: #1969f9; color: #1969f9;
} }
} }
.search-box { .search-box {
height: 60rpx; height: 60rpx;
.search-box-wrap { .search-box-wrap {
width: 80%; width: 80%;
height: 60rpx; height: 60rpx;
...@@ -60,15 +74,18 @@ ...@@ -60,15 +74,18 @@
border-radius: 10rpx; border-radius: 10rpx;
padding: 0 18rpx 0 0; padding: 0 18rpx 0 0;
} }
.sn { .sn {
width: 164rpx; width: 164rpx;
height: 35rpx; height: 35rpx;
border-right: 1px solid #f0f0f2; border-right: 1px solid #f0f0f2;
.uni-input { .uni-input {
font-size: 18rpx; font-size: 18rpx;
color: #292b33; color: #292b33;
font-weight: bold; font-weight: bold;
} }
.uni-arrow { .uni-arrow {
width: 14rpx; width: 14rpx;
height: 9rpx; height: 9rpx;
...@@ -77,28 +94,34 @@ ...@@ -77,28 +94,34 @@
margin-left: 12rpx; margin-left: 12rpx;
} }
} }
.search-bar { .search-bar {
width: calc(100% - 164rpx); width: calc(100% - 164rpx);
.icon-juxing1 { .icon-juxing1 {
font-size: 30rpx; font-size: 30rpx;
color: #919399; color: #919399;
margin-left: 17rpx; margin-left: 17rpx;
margin-right: 13rpx; margin-right: 13rpx;
} }
.uni-input { .uni-input {
font-size: 18rpx; font-size: 18rpx;
color: #484b59; color: #484b59;
} }
.icon-a-juxing11 { .icon-a-juxing11 {
font-size: 30rpx; font-size: 30rpx;
color: #c6c7cc; color: #c6c7cc;
} }
} }
} }
.list { .list {
margin-top: 15rpx; margin-top: 15rpx;
padding-bottom: 150rpx; padding-bottom: 150rpx;
flex-wrap: wrap; flex-wrap: wrap;
.box { .box {
position: relative; position: relative;
padding: 15rpx 17rpx 12rpx 17rpx; padding: 15rpx 17rpx 12rpx 17rpx;
...@@ -109,6 +132,7 @@ ...@@ -109,6 +132,7 @@
border-radius: 10rpx; border-radius: 10rpx;
margin-right: 15rpx; margin-right: 15rpx;
margin-bottom: 15rpx; margin-bottom: 15rpx;
.check-box-icon { .check-box-icon {
position: absolute; position: absolute;
right: 18rpx; right: 18rpx;
...@@ -119,33 +143,41 @@ ...@@ -119,33 +143,41 @@
background-size: contain; background-size: contain;
display: block; display: block;
} }
&.curr { &.curr {
border: 1px solid #1969f9; border: 1px solid #1969f9;
.check-box-icon { .check-box-icon {
background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center; background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center;
background-size: contain; background-size: contain;
} }
} }
&:nth-of-type(2n) { &:nth-of-type(2n) {
margin-right: 0; margin-right: 0;
} }
.bor { .bor {
height: 1px; height: 1px;
background-color: #f0f0f2; background-color: #f0f0f2;
margin-bottom: 10rpx; margin-bottom: 10rpx;
} }
.text-item { .text-item {
margin-bottom: 11rpx; margin-bottom: 11rpx;
} }
.label { .label {
width: 82rpx; width: 82rpx;
font-size: 16rpx; font-size: 16rpx;
color: #919399; color: #919399;
} }
.t1 { .t1 {
font-size: 16rpx; font-size: 16rpx;
color: #1969f9; color: #1969f9;
} }
.tt { .tt {
width: calc(100% - 93rpx); width: calc(100% - 93rpx);
font-size: 16rpx; font-size: 16rpx;
...@@ -154,18 +186,22 @@ ...@@ -154,18 +186,22 @@
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
} }
.mb20 { .mb20 {
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
.btn-box { .btn-box {
.b1 { .b1 {
font-size: 15rpx; font-size: 15rpx;
color: #919399; color: #919399;
} }
.b2 { .b2 {
font-size: 15rpx; font-size: 15rpx;
color: #1969f9; color: #1969f9;
} }
.btn { .btn {
width: 68rpx; width: 68rpx;
height: 30rpx; height: 30rpx;
...@@ -174,6 +210,7 @@ ...@@ -174,6 +210,7 @@
font-size: 15rpx; font-size: 15rpx;
color: #ffffff; color: #ffffff;
} }
.btn1 { .btn1 {
width: 68rpx; width: 68rpx;
height: 30rpx; height: 30rpx;
...@@ -185,12 +222,14 @@ ...@@ -185,12 +222,14 @@
} }
} }
} }
.fix-btn { .fix-btn {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
height: 75rpx; height: 75rpx;
left: 0; left: 0;
.btn1 { .btn1 {
width: 248rpx; width: 248rpx;
height: 75rpx; height: 75rpx;
...@@ -198,6 +237,7 @@ ...@@ -198,6 +237,7 @@
font-size: 23rpx; font-size: 23rpx;
color: #ff3700; color: #ff3700;
} }
.btn2 { .btn2 {
width: calc(100% - 248rpx); width: calc(100% - 248rpx);
height: 75rpx; height: 75rpx;
...@@ -205,17 +245,20 @@ ...@@ -205,17 +245,20 @@
font-size: 23rpx; font-size: 23rpx;
color: #ffffff; color: #ffffff;
} }
.btn3 { .btn3 {
width: 128rpx; width: 128rpx;
height: 75rpx; height: 75rpx;
background: #ffffff; background: #ffffff;
border-right: 1px solid #f0f0f2; border-right: 1px solid #f0f0f2;
.check-box-icon { .check-box-icon {
width: 20rpx; width: 20rpx;
height: 20rpx; height: 20rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/11/0bf30da3e8ce6c476c210173b5f13d51.png') no-repeat center; background: url('https://img.ichunt.com/images/ichunt/202304/11/0bf30da3e8ce6c476c210173b5f13d51.png') no-repeat center;
background-size: contain; background-size: contain;
display: block; display: block;
&.curr { &.curr {
background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center; background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center;
background-size: contain; background-size: contain;
...@@ -228,6 +271,7 @@ ...@@ -228,6 +271,7 @@
color: #484b59; color: #484b59;
} }
} }
.btn4 { .btn4 {
width: calc(100% - 128rpx); width: calc(100% - 128rpx);
height: 75rpx; height: 75rpx;
...@@ -247,13 +291,16 @@ ...@@ -247,13 +291,16 @@
width: 100%; width: 100%;
background-color: #ffffff; background-color: #ffffff;
padding: 22rpx 22rpx 0 22rpx; padding: 22rpx 22rpx 0 22rpx;
.tip { .tip {
color: red; color: red;
font-size: 17rpx; font-size: 17rpx;
margin-top: 28rpx; margin-top: 28rpx;
} }
.title { .title {
position: relative; position: relative;
.iconfont { .iconfont {
position: absolute; position: absolute;
left: 0; left: 0;
...@@ -261,12 +308,14 @@ ...@@ -261,12 +308,14 @@
font-size: 30rpx; font-size: 30rpx;
color: #292b33; color: #292b33;
} }
.text { .text {
font-size: 23rpx; font-size: 23rpx;
color: #292b33; color: #292b33;
font-weight: bold; font-weight: bold;
} }
} }
.pp { .pp {
font-size: 20rpx; font-size: 20rpx;
color: #292b33; color: #292b33;
...@@ -274,16 +323,20 @@ ...@@ -274,16 +323,20 @@
margin-bottom: 17rpx; margin-bottom: 17rpx;
margin-top: 35rpx; margin-top: 35rpx;
transition: all 0.2s ease; transition: all 0.2s ease;
&.pt { &.pt {
margin-bottom: 35rpx; margin-bottom: 35rpx;
} }
text:first-child { text:first-child {
margin-right: 32rpx; margin-right: 32rpx;
} }
.curr { .curr {
position: relative; position: relative;
color: #1969f9; color: #1969f9;
font-weight: bold; font-weight: bold;
&::after { &::after {
content: ''; content: '';
background-color: #1969f9; background-color: #1969f9;
...@@ -297,17 +350,21 @@ ...@@ -297,17 +350,21 @@
} }
} }
} }
.field-item { .field-item {
flex-wrap: wrap; flex-wrap: wrap;
margin-top: 16rpx; margin-top: 16rpx;
.item { .item {
flex: 0 0 50%; flex: 0 0 50%;
margin-bottom: 8rpx; margin-bottom: 8rpx;
.label { .label {
font-size: 16rpx; font-size: 16rpx;
color: #919399; color: #919399;
white-space: nowrap; white-space: nowrap;
} }
.text { .text {
font-size: 16rpx; font-size: 16rpx;
color: #1969f9; color: #1969f9;
...@@ -317,6 +374,7 @@ ...@@ -317,6 +374,7 @@
overflow: hidden; overflow: hidden;
max-width: 176rpx; max-width: 176rpx;
} }
.tt { .tt {
font-size: 17rpx; font-size: 17rpx;
color: #484b59; color: #484b59;
...@@ -328,6 +386,7 @@ ...@@ -328,6 +386,7 @@
} }
} }
} }
.drawer-list { .drawer-list {
.box { .box {
position: relative; position: relative;
...@@ -337,35 +396,43 @@ ...@@ -337,35 +396,43 @@
border-radius: 10rpx; border-radius: 10rpx;
border: 1px solid #c6c7cc; border: 1px solid #c6c7cc;
margin-bottom: 15rpx; margin-bottom: 15rpx;
.top { .top {
margin-bottom: 10rpx; margin-bottom: 10rpx;
.t1 { .t1 {
font-size: 17rpx; font-size: 17rpx;
color: #1969f9; color: #1969f9;
font-weight: bold; font-weight: bold;
} }
.t2 { .t2 {
font-size: 20rpx; font-size: 20rpx;
color: #292b33; color: #292b33;
font-weight: bold; font-weight: bold;
margin-left: 8rpx; margin-left: 8rpx;
} }
.t3 { .t3 {
font-size: 16rpx; font-size: 16rpx;
color: #919399; color: #919399;
} }
.t4 { .t4 {
font-size: 16rpx; font-size: 16rpx;
color: #484b59; color: #484b59;
} }
} }
.bar { .bar {
line-height: 26rpx; line-height: 26rpx;
.tt { .tt {
font-size: 16rpx; font-size: 16rpx;
color: #919399; color: #919399;
white-space: nowrap; white-space: nowrap;
} }
.yy { .yy {
max-width: 55%; max-width: 55%;
font-size: 16rpx; font-size: 16rpx;
...@@ -377,23 +444,27 @@ ...@@ -377,23 +444,27 @@
} }
} }
} }
.time { .time {
margin-top: 8rpx; margin-top: 8rpx;
font-size: 16rpx; font-size: 16rpx;
color: #919399; color: #919399;
} }
.btn { .btn {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
width: 100%; width: 100%;
.btn1 { .btn1 {
height: 75rpx; height: 75rpx;
background: #1969f9; background: #1969f9;
font-size: 23rpx; font-size: 23rpx;
color: #ffffff; color: #ffffff;
} }
.btn2 { .btn2 {
height: 75rpx; height: 75rpx;
background: #ffe0d7; background: #ffe0d7;
...@@ -402,31 +473,37 @@ ...@@ -402,31 +473,37 @@
font-weight: bold; font-weight: bold;
} }
} }
.tip-box { .tip-box {
margin-top: 36rpx; margin-top: 36rpx;
margin-bottom: 23rpx; margin-bottom: 23rpx;
height: 60rpx; height: 60rpx;
background: #fff5ec; background: #fff5ec;
border-radius: 30rpx 30rpx 30rpx 30rpx; border-radius: 30rpx 30rpx 30rpx 30rpx;
.iconfont { .iconfont {
font-size: 30rpx; font-size: 30rpx;
color: #f98119; color: #f98119;
margin-left: 23rpx; margin-left: 23rpx;
} }
.tt { .tt {
margin-left: 12rpx; margin-left: 12rpx;
font-size: 20rpx; font-size: 20rpx;
color: #f98119; color: #f98119;
} }
} }
.input-wrap { .input-wrap {
margin-bottom: 25rpx; margin-bottom: 25rpx;
.label-title { .label-title {
font-size: 20rpx; font-size: 20rpx;
color: #484b59; color: #484b59;
font-weight: bold; font-weight: bold;
margin-bottom: 10rpx; margin-bottom: 10rpx;
} }
.input-box { .input-box {
.uni-arrow { .uni-arrow {
width: 14rpx; width: 14rpx;
...@@ -435,6 +512,7 @@ ...@@ -435,6 +512,7 @@
background-size: contain; background-size: contain;
margin-left: 12rpx; margin-left: 12rpx;
} }
.uni-input { .uni-input {
height: 55rpx; height: 55rpx;
background: #ffffff; background: #ffffff;
...@@ -443,6 +521,7 @@ ...@@ -443,6 +521,7 @@
font-size: 17rpx; font-size: 17rpx;
padding-left: 18rpx; padding-left: 18rpx;
} }
.uni-textarea { .uni-textarea {
width: 100%; width: 100%;
height: 110rpx; height: 110rpx;
...@@ -453,6 +532,7 @@ ...@@ -453,6 +532,7 @@
padding: 18rpx; padding: 18rpx;
} }
} }
.sel-box { .sel-box {
height: 55rpx; height: 55rpx;
background: #ffffff; background: #ffffff;
...@@ -460,6 +540,7 @@ ...@@ -460,6 +540,7 @@
border: 1px solid #1969f9; border: 1px solid #1969f9;
font-size: 17rpx; font-size: 17rpx;
padding-left: 18rpx; padding-left: 18rpx;
.uni-arrow { .uni-arrow {
width: 14rpx; width: 14rpx;
height: 9rpx; height: 9rpx;
...@@ -469,23 +550,29 @@ ...@@ -469,23 +550,29 @@
} }
} }
} }
.uni-swiper-wrap { .uni-swiper-wrap {
margin-top: 15rpx; margin-top: 15rpx;
.uni-swiper-input { .uni-swiper-input {
margin-bottom: 15rpx; margin-bottom: 15rpx;
.label { .label {
width: 24%; width: 24%;
font-size: 16rpx; font-size: 16rpx;
color: #919399; color: #919399;
&.required:before { &.required:before {
content: ' *'; content: ' *';
color: red; color: red;
} }
} }
.select-box { .select-box {
position: relative; position: relative;
width: 76%; width: 76%;
height: 45rpx; height: 45rpx;
.uni-arrow { .uni-arrow {
position: absolute; position: absolute;
right: 14rpx; right: 14rpx;
...@@ -494,6 +581,7 @@ ...@@ -494,6 +581,7 @@
background: url('https://img.ichunt.com/images/ichunt/202304/10/e4c72319ad41ce1425f71cc6ec35f111.png') no-repeat center; background: url('https://img.ichunt.com/images/ichunt/202304/10/e4c72319ad41ce1425f71cc6ec35f111.png') no-repeat center;
background-size: contain; background-size: contain;
} }
.uni-input { .uni-input {
width: 100%; width: 100%;
height: 45rpx; height: 45rpx;
...@@ -504,9 +592,11 @@ ...@@ -504,9 +592,11 @@
padding-left: 18rpx; padding-left: 18rpx;
} }
} }
.input-box { .input-box {
position: relative; position: relative;
width: 76%; width: 76%;
.uni-input { .uni-input {
width: 100%; width: 100%;
height: 45rpx; height: 45rpx;
...@@ -518,10 +608,20 @@ ...@@ -518,10 +608,20 @@
} }
} }
} }
.uni-swiper-input-multipl { .uni-swiper-input-multipl {
margin-bottom: 15rpx; margin-bottom: 15rpx;
.label { .label {
width: 24%; width: 24%;
font-size: 16rpx;
color: #919399;
&.required:before {
content: ' *';
color: red;
}
.uni-arrow { .uni-arrow {
width: 14rpx; width: 14rpx;
height: 9rpx; height: 9rpx;
...@@ -529,12 +629,15 @@ ...@@ -529,12 +629,15 @@
background-size: contain; background-size: contain;
margin-right: 10rpx; margin-right: 10rpx;
} }
.uni-input { .uni-input {
font-size: 17rpx; font-size: 17rpx;
} }
} }
.multipl-input { .multipl-input {
width: 76%; width: 76%;
.uni-input { .uni-input {
width: 100%; width: 100%;
height: 45rpx; height: 45rpx;
...@@ -544,12 +647,14 @@ ...@@ -544,12 +647,14 @@
font-size: 17rpx; font-size: 17rpx;
padding-left: 18rpx; padding-left: 18rpx;
} }
.timesSymbol { .timesSymbol {
padding: 0 14rpx; padding: 0 14rpx;
font-size: 24rpx; font-size: 24rpx;
color: #292b33; color: #292b33;
font-weight: bold; font-weight: bold;
} }
.unit { .unit {
margin-left: 10rpx; margin-left: 10rpx;
color: #919399; color: #919399;
...@@ -558,6 +663,7 @@ ...@@ -558,6 +663,7 @@
} }
} }
} }
.swiper { .swiper {
height: 790rpx; height: 790rpx;
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment