update

src/packages/gcszt/assets/themes/default/default.less

@@ -16,7 +16,7 @@
     --color-down: #04c786;
 
     /* 导航栏 */
-    --navbar-height: .88rem;
+    --navbar-height: 44px;
     --navbar-color: #fff;
     --navbar-background: #C30D23;
     --navbar-backbutton-color: #fff;
@@ -27,7 +27,7 @@
     --tabbar-icon-active: #c30d23;
 
     /* 内容边距 */
-    --content-inset: .24rem;
+    --content-inset: 12px;
 
     /* Vant-Button */
     --van-button-border-width: 0;
@@ -52,12 +52,12 @@
                 align-items: center;
                 color: #626675;
                 cursor: pointer;
-                border-radius: .04rem;
+                border-radius: 2px;
                 background-color: #f0f0f1;
-                padding: .08rem .16rem;
+                padding: 4px 8px;
 
                 &:not(:first-child) {
-                    margin-left: .1rem;
+                    margin-left: 5px;
                 }
 
                 &.is-active {

src/packages/gcszt/assets/themes/global/global.less

@@ -51,16 +51,16 @@
     &__container {
         display: flex;
         flex-direction: column;
-        padding-bottom: .32rem;
+        padding-bottom: 16px;
 
         /* 父元素的第一个子元素 */
         .van-cell-group--inset:first-of-type {
-            margin-top: .32rem;
+            margin-top: 16px;
         }
 
         /* 相邻兄弟元素 */
         .van-cell-group--inset+.van-cell-group--inset {
-            margin-top: .24rem;
+            margin-top: 12px;
         }
 
         .van-field {
@@ -85,8 +85,8 @@
         }
 
         &.inset {
-            gap: .2rem;
-            padding: .2rem .32rem;
+            gap: 10px;
+            padding: 10px 16px;
         }
     }
 }
@@ -132,33 +132,33 @@
 .g-navmenu {
     .app-iconfont {
         .g-icon {
-            width: .36rem;
-            height: .36rem;
-            font-size: .36rem;
+            width: 18px;
+            height: 18px;
+            font-size: 18px;
         }
 
         &__label {
-            margin-left: .24rem;
+            margin-left: 12px;
         }
     }
 }
 
 /* 商品列表 */
 .g-goods-list {
-    padding: .2rem;
+    padding: 10px;
 
     .list {
-        padding: .2rem .2rem 0 .2rem;
+        padding: 10px 10px 0 10px;
 
         &-item {
             display: flex;
             align-items: center;
-            border-radius: .1rem;
+            border-radius: 5px;
             overflow: hidden;
-            padding: .2rem;
+            padding: 10px;
 
             &:not(:last-child) {
-                margin-bottom: .2rem;
+                margin-bottom: 10px;
             }
 
             .img {
@@ -167,18 +167,18 @@
                     align-items: center;
 
                     img {
-                        width: 1.8rem;
-                        height: 1.8rem;
+                        width: 90px;
+                        height: 90px;
                         object-fit: cover;
-                        border-radius: .16rem;
-                        margin-right: .3rem;
+                        border-radius: 8px;
+                        margin-right: 15px;
                     }
                 }
 
                 &:last-child {
                     .van-button {
-                        width: 1.3rem;
-                        height: .5rem;
+                        width: 65px;
+                        height: 25px;
                     }
                 }
             }
@@ -188,20 +188,20 @@
 
                 .title {
                     color: #333;
-                    font-size: .30rem;
+                    font-size: 15px;
                 }
 
                 .desc {
                     color: #666;
-                    font-size: .24rem;
-                    padding: .1rem 0;
+                    font-size: 12px;
+                    padding: 5px 0;
                 }
 
                 .price {
 
                     .buyprice,
                     .sellprice {
-                        padding-bottom: .02rem;
+                        padding-bottom: 1px;
                     }
                 }
             }
@@ -210,44 +210,44 @@
 }
 
 .g-goods-waterfall {
-    padding: .2rem;
+    padding: 10px;
 
     .goods {
         background-color: #fff;
-        border-radius: .12rem;
+        border-radius: 6px;
         overflow: hidden;
 
         &-image {
             display: flex;
             justify-content: center;
             align-items: center;
-            min-height: 2.4rem;
+            min-height: 120px;
             font-size: 0;
         }
 
         &-info {
-            padding: .2rem;
+            padding: 10px;
 
             &__title {
-                font-size: .26rem;
-                margin-bottom: .1rem;
+                font-size: 13px;
+                margin-bottom: 5px;
             }
 
             &__desc {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
-                margin-bottom: .1rem;
+                margin-bottom: 5px;
             }
 
             &__price {
                 color: #f2270c;
 
                 .unit {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .integer {
-                    font-size: .3rem;
+                    font-size: 15px;
                 }
             }
         }
@@ -256,24 +256,24 @@
 
 /* 订单列表 */
 .g-order-list {
-    padding: .2rem;
+    padding: 10px;
     padding-bottom: 0;
 
     &__box {
         &:not(:first-child) {
-            margin-top: .2rem;
+            margin-top: 10px;
         }
 
         background-color: #fff;
-        border-radius: .16rem;
-        padding: .24rem;
+        border-radius: 8px;
+        padding: 12px;
 
     }
 
     &__titlebar {
         display: flex;
         justify-content: space-between;
-        margin-bottom: .2rem;
+        margin-bottom: 10px;
 
         .left {
             h4 {
@@ -281,19 +281,19 @@
             }
 
             span {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
             }
         }
 
         .right {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
         }
     }
 
     &__content {
-        font-size: .24rem;
+        font-size: 12px;
 
         ul {
             display: flex;
@@ -303,14 +303,14 @@
             li {
                 display: flex;
                 justify-content: space-between;
-                line-height: .4rem;
-                width: calc(~"50% - .24rem");
+                line-height: 20px;
+                width: calc(~"50% - 12px");
 
                 span {
                     &:first-child {
                         color: #999;
                         white-space: nowrap;
-                        padding-right: .24rem;
+                        padding-right: 12px;
                     }
                 }
             }
@@ -320,11 +320,11 @@
     &__btnbar {
         display: flex;
         justify-content: flex-end;
-        gap: .16rem;
-        margin-top: .2rem;
+        gap: 8px;
+        margin-top: 10px;
 
         .van-button {
-            width: 1.6rem;
+            width: 80px;
             border-width: 1px;
         }
     }
@@ -340,30 +340,30 @@
             align-items: center;
             color: #fff;
             background-image: linear-gradient(to right, #ee0a24, #ff6034);
-            padding: .2rem .24rem;
+            padding: 10px 12px;
 
             &-left {
                 .price-text {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .price-integer {
-                    font-size: .44rem;
+                    font-size: 22px;
                 }
             }
 
             &-right {
                 display: flex;
                 flex-direction: column;
-                font-size: .24rem;
+                font-size: 12px;
             }
         }
 
         .title {
-            font-size: .3rem;
+            font-size: 15px;
             font-weight: bold;
-            line-height: .48rem;
-            padding: .24rem;
+            line-height: 24px;
+            padding: 12px;
             padding-bottom: 0;
 
             .van-tag {
@@ -371,34 +371,34 @@
             }
 
             span {
-                margin-right: .1rem;
+                margin-right: 5px;
             }
         }
 
         .desc {
-            padding: 0 .24rem;
+            padding: 0 12px;
         }
 
         .qty {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
-            padding: .1rem .24rem 0 .24rem;
+            padding: 5px 12px 0 12px;
         }
 
         .info {
             background-color: #fff;
-            padding: .2rem;
+            padding: 10px;
 
             ul {
                 display: flex;
                 flex-wrap: wrap;
-                font-size: .26rem;
+                font-size: 13px;
 
                 li {
                     display: flex;
                     justify-content: space-between;
                     width: 50%;
-                    padding: .08rem .24rem;
+                    padding: 4px 12px;
 
                     span {
                         &:first-child {
@@ -412,22 +412,22 @@
 
     &__desc {
         background-color: #fff;
-        margin-top: .24rem;
+        margin-top: 12px;
     }
 
     &__footer {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        height: .88rem;
+        height: 44px;
         background-color: #fff;
 
         .price {
-            padding-left: .32rem;
+            padding-left: 16px;
 
             &-text,
             &-unit {
-                font-size: .24rem;
+                font-size: 12px;
             }
 
             &-unit {
@@ -435,7 +435,7 @@
             }
 
             &-integer {
-                font-size: .32rem;
+                font-size: 16px;
                 color: #f2270c;
             }
         }
@@ -450,10 +450,10 @@
                 justify-content: center;
                 align-items: center;
                 height: 100%;
-                min-width: 2rem;
+                min-width: 100px;
                 font-weight: bold;
                 color: #fff;
-                padding: 0 .48rem;
+                padding: 0 24px;
 
                 &.warning {
                     background-image: linear-gradient(to right, #ffd01e, #ff8917);
@@ -478,7 +478,7 @@
     &__stepper {
         display: flex;
         align-items: center;
-        gap: .1rem;
+        gap: 5px;
         width: 100%;
 
         .van-stepper {
@@ -495,12 +495,12 @@
         display: flex;
         flex-wrap: wrap;
         width: 100%;
-        margin-top: .2rem;
+        margin-top: 10px;
     }
 
     .van-radio {
         width: calc(~'100% / 3');
-        padding: .04rem;
+        padding: 2px;
         margin-right: 0;
 
         .van-radio__icon {
@@ -510,12 +510,12 @@
         &__label {
             display: block;
             width: 100%;
-            font-size: .24rem;
+            font-size: 12px;
             text-align: center;
             color: #666;
             border: 1px solid #e5e5e5;
-            border-radius: .08rem;
-            padding: .04rem;
+            border-radius: 4px;
+            padding: 2px;
             margin-left: 0;
         }
 
@@ -531,8 +531,8 @@
 .van {
     &-dialog {
         &__message {
-            font-size: .28rem;
-            line-height: .44rem;
+            font-size: 14px;
+            line-height: 22px;
         }
     }
 

src/packages/gcszt/postcss.config.js

@@ -1,9 +1,10 @@
 module.exports = {
     plugins: {
-        // 'postcss-px-to-viewport': {
-        //     viewportWidth: 375,
-        //     landscape: true,
-        //     landscapeWidth: 980,
-        // },
+        'postcss-px-to-viewport': {
+            viewportWidth: 375,
+            landscape: true, // 是否处理横屏情况
+            landscapeUnit: 'vw', // 横屏时使用的单位
+            landscapeWidth: 844, // 横屏时使用的视口宽度
+        },
     },
 }

src/packages/gcszt/views/mine/index.less

@@ -1,7 +1,7 @@
 @import '@mobile/assets/themes/base/mixin.less';
 
 .mine {
-    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 3rem, transparent 3rem);
+    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 150px, transparent 150px);
 
     .app-navbar {
         background-image: @backgroundImage;
@@ -16,13 +16,13 @@
         color: #000;
         background-color: #fff;
         background-image: @backgroundImage;
-        padding: 0 .36rem;
+        padding: 0 18px;
 
         &__wrapper {
             background-color: #fff;
-            border-top-left-radius: .2rem;
-            border-top-right-radius: .2rem;
-            padding: .24rem;
+            border-top-left-radius: 10px;
+            border-top-right-radius: 10px;
+            padding: 12px;
         }
 
         .profile {
@@ -34,21 +34,21 @@
                 align-items: center;
 
                 .g-image--avatar {
-                    width: .8rem;
-                    height: .8rem;
+                    width: 40px;
+                    height: 40px;
                     border-radius: 50%;
                     font-size: 0;
-                    margin-right: .16rem;
+                    margin-right: 8px;
                 }
 
                 &__info {
                     flex: 1;
-                    padding-right: .32rem;
+                    padding-right: 16px;
 
                     .top {
                         display: flex;
                         align-items: center;
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #A1B1C5;
 
                         span {
@@ -57,13 +57,13 @@
 
                         .van-icon {
                             line-height: normal;
-                            margin-left: .04rem;
+                            margin-left: 2px;
                         }
                     }
 
                     .bottom {
-                        line-height: .4rem;
-                        font-size: .3rem;
+                        line-height: 20px;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -75,21 +75,21 @@
                 justify-content: center;
 
                 span {
-                    line-height: .4rem;
+                    line-height: 20px;
 
                     &:first-child {
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #46D63C;
 
                         &::before {
                             content: '资金账户';
                             color: #A1B1C5;
-                            margin-right: .12rem;
+                            margin-right: 6px;
                         }
                     }
 
                     &:last-child {
-                        font-size: .3rem;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -99,24 +99,24 @@
         .bank {
             display: flex;
             justify-content: space-around;
-            padding: .36rem 0;
+            padding: 18px 0;
 
             ul {
                 li {
                     display: flex;
                     flex-direction: column;
-                    padding-bottom: .1rem;
+                    padding-bottom: 5px;
 
                     span {
-                        line-height: .4rem;
+                        line-height: 20px;
 
                         &:first-child {
-                            font-size: .24rem;
+                            font-size: 12px;
                             color: #A1B1C5;
                         }
 
                         &:last-child {
-                            font-size: .3rem;
+                            font-size: 15px;
                             font-weight: bold;
                         }
                     }
@@ -129,8 +129,8 @@
             justify-content: space-around;
 
             .van-button {
-                width: 2.8rem;
-                box-shadow: 0 .06rem .14rem 0 #e0e2e8;
+                width: 140px;
+                box-shadow: 0 3px 7px 0 #e0e2e8;
             }
         }
     }
@@ -139,7 +139,7 @@
         ul {
             display: flex;
             background-color: #fff;
-            padding: .24rem;
+            padding: 12px;
 
             li {
                 flex: 1;
@@ -148,8 +148,8 @@
                 align-items: center;
 
                 .g-icon {
-                    font-size: .56rem;
-                    margin-bottom: .04rem;
+                    font-size: 28px;
+                    margin-bottom: 2px;
                 }
             }
         }
@@ -157,7 +157,7 @@
 
     &-footer {
         text-align: center;
-        padding: .2rem 0;
+        padding: 10px 0;
 
         .button-logout {
             width: 50%;

src/packages/gcszt/views/user/login/index.less

@@ -3,7 +3,7 @@
 
     &-logo {
         img {
-            height: 1.3rem;
+            height: 65px;
         }
     }
 }

src/packages/gstj/assets/themes/default/default.less

@@ -16,7 +16,7 @@
     --color-down: #04c786;
 
     /* 导航栏 */
-    --navbar-height: .88rem;
+    --navbar-height: 44px;
     --navbar-color: #fff;
     --navbar-background: #C30D23;
     --navbar-backbutton-color: #fff;
@@ -27,7 +27,7 @@
     --tabbar-icon-active: #c30d23;
 
     /* 内容边距 */
-    --content-inset: .24rem;
+    --content-inset: 12px;
 
     /* Vant-Button */
     --van-button-border-width: 0;
@@ -52,12 +52,12 @@
                 align-items: center;
                 color: #626675;
                 cursor: pointer;
-                border-radius: .04rem;
+                border-radius: 2px;
                 background-color: #f0f0f1;
-                padding: .08rem .16rem;
+                padding: 4px 8px;
 
                 &:not(:first-child) {
-                    margin-left: .1rem;
+                    margin-left: 5px;
                 }
 
                 &.is-active {

src/packages/gstj/assets/themes/global/global.less

@@ -51,16 +51,16 @@
     &__container {
         display: flex;
         flex-direction: column;
-        padding-bottom: .32rem;
+        padding-bottom: 16px;
 
         /* 父元素的第一个子元素 */
         .van-cell-group--inset:first-of-type {
-            margin-top: .32rem;
+            margin-top: 16px;
         }
 
         /* 相邻兄弟元素 */
         .van-cell-group--inset+.van-cell-group--inset {
-            margin-top: .24rem;
+            margin-top: 12px;
         }
 
         .van-field {
@@ -85,8 +85,8 @@
         }
 
         &.inset {
-            gap: .2rem;
-            padding: .2rem .32rem;
+            gap: 10px;
+            padding: 10px 16px;
         }
     }
 }
@@ -132,33 +132,33 @@
 .g-navmenu {
     .app-iconfont {
         .g-icon {
-            width: .36rem;
-            height: .36rem;
-            font-size: .36rem;
+            width: 18px;
+            height: 18px;
+            font-size: 18px;
         }
 
         &__label {
-            margin-left: .24rem;
+            margin-left: 12px;
         }
     }
 }
 
 /* 商品列表 */
 .g-goods-list {
-    padding: .2rem;
+    padding: 10px;
 
     .list {
-        padding: .2rem .2rem 0 .2rem;
+        padding: 10px 10px 0 10px;
 
         &-item {
             display: flex;
             align-items: center;
-            border-radius: .1rem;
+            border-radius: 5px;
             overflow: hidden;
-            padding: .2rem;
+            padding: 10px;
 
             &:not(:last-child) {
-                margin-bottom: .2rem;
+                margin-bottom: 10px;
             }
 
             .img {
@@ -167,18 +167,18 @@
                     align-items: center;
 
                     img {
-                        width: 1.8rem;
-                        height: 1.8rem;
+                        width: 90px;
+                        height: 90px;
                         object-fit: cover;
-                        border-radius: .16rem;
-                        margin-right: .3rem;
+                        border-radius: 8px;
+                        margin-right: 15px;
                     }
                 }
 
                 &:last-child {
                     .van-button {
-                        width: 1.3rem;
-                        height: .5rem;
+                        width: 65px;
+                        height: 25px;
                     }
                 }
             }
@@ -188,20 +188,20 @@
 
                 .title {
                     color: #333;
-                    font-size: .30rem;
+                    font-size: 15px;
                 }
 
                 .desc {
                     color: #666;
-                    font-size: .24rem;
-                    padding: .1rem 0;
+                    font-size: 12px;
+                    padding: 5px 0;
                 }
 
                 .price {
 
                     .buyprice,
                     .sellprice {
-                        padding-bottom: .02rem;
+                        padding-bottom: 1px;
                     }
                 }
             }
@@ -210,44 +210,44 @@
 }
 
 .g-goods-waterfall {
-    padding: .2rem;
+    padding: 10px;
 
     .goods {
         background-color: #fff;
-        border-radius: .12rem;
+        border-radius: 6px;
         overflow: hidden;
 
         &-image {
             display: flex;
             justify-content: center;
             align-items: center;
-            min-height: 2.4rem;
+            min-height: 120px;
             font-size: 0;
         }
 
         &-info {
-            padding: .2rem;
+            padding: 10px;
 
             &__title {
-                font-size: .26rem;
-                margin-bottom: .1rem;
+                font-size: 13px;
+                margin-bottom: 5px;
             }
 
             &__desc {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
-                margin-bottom: .1rem;
+                margin-bottom: 5px;
             }
 
             &__price {
                 color: #f2270c;
 
                 .unit {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .integer {
-                    font-size: .3rem;
+                    font-size: 15px;
                 }
             }
         }
@@ -256,24 +256,24 @@
 
 /* 订单列表 */
 .g-order-list {
-    padding: .2rem;
+    padding: 10px;
     padding-bottom: 0;
 
     &__box {
         &:not(:first-child) {
-            margin-top: .2rem;
+            margin-top: 10px;
         }
 
         background-color: #fff;
-        border-radius: .16rem;
-        padding: .24rem;
+        border-radius: 8px;
+        padding: 12px;
 
     }
 
     &__titlebar {
         display: flex;
         justify-content: space-between;
-        margin-bottom: .2rem;
+        margin-bottom: 10px;
 
         .left {
             h4 {
@@ -281,19 +281,19 @@
             }
 
             span {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
             }
         }
 
         .right {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
         }
     }
 
     &__content {
-        font-size: .24rem;
+        font-size: 12px;
 
         ul {
             display: flex;
@@ -303,14 +303,14 @@
             li {
                 display: flex;
                 justify-content: space-between;
-                line-height: .4rem;
-                width: calc(~"50% - .24rem");
+                line-height: 20px;
+                width: calc(~"50% - 12px");
 
                 span {
                     &:first-child {
                         color: #999;
                         white-space: nowrap;
-                        padding-right: .24rem;
+                        padding-right: 12px;
                     }
                 }
             }
@@ -320,11 +320,11 @@
     &__btnbar {
         display: flex;
         justify-content: flex-end;
-        gap: .16rem;
-        margin-top: .2rem;
+        gap: 8px;
+        margin-top: 10px;
 
         .van-button {
-            width: 1.6rem;
+            width: 80px;
             border-width: 1px;
         }
     }
@@ -340,30 +340,30 @@
             align-items: center;
             color: #fff;
             background-image: linear-gradient(to right, #ee0a24, #ff6034);
-            padding: .2rem .24rem;
+            padding: 10px 12px;
 
             &-left {
                 .price-text {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .price-integer {
-                    font-size: .44rem;
+                    font-size: 22px;
                 }
             }
 
             &-right {
                 display: flex;
                 flex-direction: column;
-                font-size: .24rem;
+                font-size: 12px;
             }
         }
 
         .title {
-            font-size: .3rem;
+            font-size: 15px;
             font-weight: bold;
-            line-height: .48rem;
-            padding: .24rem;
+            line-height: 24px;
+            padding: 12px;
             padding-bottom: 0;
 
             .van-tag {
@@ -371,34 +371,34 @@
             }
 
             span {
-                margin-right: .1rem;
+                margin-right: 5px;
             }
         }
 
         .desc {
-            padding: 0 .24rem;
+            padding: 0 12px;
         }
 
         .qty {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
-            padding: .1rem .24rem 0 .24rem;
+            padding: 5px 12px 0 12px;
         }
 
         .info {
             background-color: #fff;
-            padding: .2rem;
+            padding: 10px;
 
             ul {
                 display: flex;
                 flex-wrap: wrap;
-                font-size: .26rem;
+                font-size: 13px;
 
                 li {
                     display: flex;
                     justify-content: space-between;
                     width: 50%;
-                    padding: .08rem .24rem;
+                    padding: 4px 12px;
 
                     span {
                         &:first-child {
@@ -412,22 +412,22 @@
 
     &__desc {
         background-color: #fff;
-        margin-top: .24rem;
+        margin-top: 12px;
     }
 
     &__footer {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        height: .88rem;
+        height: 44px;
         background-color: #fff;
 
         .price {
-            padding-left: .32rem;
+            padding-left: 16px;
 
             &-text,
             &-unit {
-                font-size: .24rem;
+                font-size: 12px;
             }
 
             &-unit {
@@ -435,7 +435,7 @@
             }
 
             &-integer {
-                font-size: .32rem;
+                font-size: 16px;
                 color: #f2270c;
             }
         }
@@ -450,10 +450,10 @@
                 justify-content: center;
                 align-items: center;
                 height: 100%;
-                min-width: 2rem;
+                min-width: 100px;
                 font-weight: bold;
                 color: #fff;
-                padding: 0 .48rem;
+                padding: 0 24px;
 
                 &.warning {
                     background-image: linear-gradient(to right, #ffd01e, #ff8917);
@@ -478,7 +478,7 @@
     &__stepper {
         display: flex;
         align-items: center;
-        gap: .1rem;
+        gap: 5px;
         width: 100%;
 
         .van-stepper {
@@ -495,12 +495,12 @@
         display: flex;
         flex-wrap: wrap;
         width: 100%;
-        margin-top: .2rem;
+        margin-top: 10px;
     }
 
     .van-radio {
         width: calc(~'100% / 3');
-        padding: .04rem;
+        padding: 2px;
         margin-right: 0;
 
         .van-radio__icon {
@@ -510,12 +510,12 @@
         &__label {
             display: block;
             width: 100%;
-            font-size: .24rem;
+            font-size: 12px;
             text-align: center;
             color: #666;
             border: 1px solid #e5e5e5;
-            border-radius: .08rem;
-            padding: .04rem;
+            border-radius: 4px;
+            padding: 2px;
             margin-left: 0;
         }
 
@@ -531,8 +531,8 @@
 .van {
     &-dialog {
         &__message {
-            font-size: .28rem;
-            line-height: .44rem;
+            font-size: 14px;
+            line-height: 22px;
         }
     }
 

src/packages/gstj/postcss.config.js

@@ -1,9 +1,10 @@
 module.exports = {
     plugins: {
-        // 'postcss-px-to-viewport': {
-        //     viewportWidth: 375,
-        //     landscape: true,
-        //     landscapeWidth: 980,
-        // },
+        'postcss-px-to-viewport': {
+            viewportWidth: 375,
+            landscape: true, // 是否处理横屏情况
+            landscapeUnit: 'vw', // 横屏时使用的单位
+            landscapeWidth: 844, // 横屏时使用的视口宽度
+        },
     },
 }

src/packages/gstj/views/mine/index.less

@@ -1,7 +1,7 @@
 @import '@mobile/assets/themes/base/mixin.less';
 
 .mine {
-    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 3rem, transparent 3rem);
+    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 150px, transparent 150px);
 
     .app-navbar {
         background-image: @backgroundImage;
@@ -16,13 +16,13 @@
         color: #000;
         background-color: #fff;
         background-image: @backgroundImage;
-        padding: 0 .36rem;
+        padding: 0 18px;
 
         &__wrapper {
             background-color: #fff;
-            border-top-left-radius: .2rem;
-            border-top-right-radius: .2rem;
-            padding: .24rem;
+            border-top-left-radius: 10px;
+            border-top-right-radius: 10px;
+            padding: 12px;
         }
 
         .profile {
@@ -34,21 +34,21 @@
                 align-items: center;
 
                 .g-image--avatar {
-                    width: .8rem;
-                    height: .8rem;
+                    width: 40px;
+                    height: 40px;
                     border-radius: 50%;
                     font-size: 0;
-                    margin-right: .16rem;
+                    margin-right: 8px;
                 }
 
                 &__info {
                     flex: 1;
-                    padding-right: .32rem;
+                    padding-right: 16px;
 
                     .top {
                         display: flex;
                         align-items: center;
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #A1B1C5;
 
                         span {
@@ -57,13 +57,13 @@
 
                         .van-icon {
                             line-height: normal;
-                            margin-left: .04rem;
+                            margin-left: 2px;
                         }
                     }
 
                     .bottom {
-                        line-height: .4rem;
-                        font-size: .3rem;
+                        line-height: 20px;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -75,21 +75,21 @@
                 justify-content: center;
 
                 span {
-                    line-height: .4rem;
+                    line-height: 20px;
 
                     &:first-child {
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #46D63C;
 
                         &::before {
                             content: '资金账户';
                             color: #A1B1C5;
-                            margin-right: .12rem;
+                            margin-right: 6px;
                         }
                     }
 
                     &:last-child {
-                        font-size: .3rem;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -99,24 +99,24 @@
         .bank {
             display: flex;
             justify-content: space-around;
-            padding: .36rem 0;
+            padding: 18px 0;
 
             ul {
                 li {
                     display: flex;
                     flex-direction: column;
-                    padding-bottom: .1rem;
+                    padding-bottom: 5px;
 
                     span {
-                        line-height: .4rem;
+                        line-height: 20px;
 
                         &:first-child {
-                            font-size: .24rem;
+                            font-size: 12px;
                             color: #A1B1C5;
                         }
 
                         &:last-child {
-                            font-size: .3rem;
+                            font-size: 15px;
                             font-weight: bold;
                         }
                     }
@@ -129,8 +129,8 @@
             justify-content: space-around;
 
             .van-button {
-                width: 2.8rem;
-                box-shadow: 0 .06rem .14rem 0 #e0e2e8;
+                width: 140px;
+                box-shadow: 0 3px 7px 0 #e0e2e8;
             }
         }
     }
@@ -139,7 +139,7 @@
         ul {
             display: flex;
             background-color: #fff;
-            padding: .24rem;
+            padding: 12px;
 
             li {
                 flex: 1;
@@ -148,8 +148,8 @@
                 align-items: center;
 
                 .g-icon {
-                    font-size: .56rem;
-                    margin-bottom: .04rem;
+                    font-size: 28px;
+                    margin-bottom: 2px;
                 }
             }
         }
@@ -157,7 +157,7 @@
 
     &-footer {
         text-align: center;
-        padding: .2rem 0;
+        padding: 10px 0;
 
         .button-logout {
             width: 50%;

src/packages/mobile/assets/themes/global/global.less

@@ -177,7 +177,7 @@
 
                 &:last-child {
                     .van-button {
-                        width: 60px;
+                        width: 65px;
                         height: 25px;
                     }
                 }

src/packages/mobile/components/modules/reward/index.less

@@ -12,7 +12,7 @@
 
         .content {
             position  : absolute;
-            top       : 1.2rem;
+            top       : 60px;
             width     : 100%;
             text-align: center;
             transition: transform 500ms;
@@ -38,7 +38,7 @@
 
         .buttons {
             position  : absolute;
-            bottom    : -.8rem;
+            bottom    : -40px;
             color     : #fff;
             text-align: center;
             width     : 100%;

src/packages/qdhs/assets/themes/default/default.less

@@ -16,7 +16,7 @@
     --color-down: #04c786;
 
     /* 导航栏 */
-    --navbar-height: .88rem;
+    --navbar-height: 44px;
     --navbar-color: #fff;
     --navbar-background: #C30D23;
     --navbar-backbutton-color: #fff;
@@ -27,7 +27,7 @@
     --tabbar-icon-active: #c30d23;
 
     /* 内容边距 */
-    --content-inset: .24rem;
+    --content-inset: 12px;
 
     /* Vant-Button */
     --van-button-border-width: 0;
@@ -52,12 +52,12 @@
                 align-items: center;
                 color: #626675;
                 cursor: pointer;
-                border-radius: .04rem;
+                border-radius: 2px;
                 background-color: #f0f0f1;
-                padding: .08rem .16rem;
+                padding: 4px 8px;
 
                 &:not(:first-child) {
-                    margin-left: .1rem;
+                    margin-left: 5px;
                 }
 
                 &.is-active {

src/packages/qdhs/assets/themes/global/global.less

@@ -51,16 +51,16 @@
     &__container {
         display: flex;
         flex-direction: column;
-        padding-bottom: .32rem;
+        padding-bottom: 16px;
 
         /* 父元素的第一个子元素 */
         .van-cell-group--inset:first-of-type {
-            margin-top: .32rem;
+            margin-top: 16px;
         }
 
         /* 相邻兄弟元素 */
         .van-cell-group--inset+.van-cell-group--inset {
-            margin-top: .24rem;
+            margin-top: 12px;
         }
 
         .van-field {
@@ -85,8 +85,8 @@
         }
 
         &.inset {
-            gap: .2rem;
-            padding: .2rem .32rem;
+            gap: 10px;
+            padding: 10px 16px;
         }
     }
 }
@@ -132,33 +132,33 @@
 .g-navmenu {
     .app-iconfont {
         .g-icon {
-            width: .36rem;
-            height: .36rem;
-            font-size: .36rem;
+            width: 18px;
+            height: 18px;
+            font-size: 18px;
         }
 
         &__label {
-            margin-left: .24rem;
+            margin-left: 12px
         }
     }
 }
 
 /* 商品列表 */
 .g-goods-list {
-    padding: .2rem;
+    padding: 10px;
 
     .list {
-        padding: .2rem .2rem 0 .2rem;
+        padding: 10px 10px 0 10px;
 
         &-item {
             display: flex;
             align-items: center;
-            border-radius: .1rem;
+            border-radius: 5px;
             overflow: hidden;
-            padding: .2rem;
+            padding: 10px;
 
             &:not(:last-child) {
-                margin-bottom: .2rem;
+                margin-bottom: 10px;
             }
 
             .img {
@@ -167,18 +167,18 @@
                     align-items: center;
 
                     img {
-                        width: 1.8rem;
-                        height: 1.8rem;
+                        width: 90px;
+                        height: 90px;
                         object-fit: cover;
-                        border-radius: .16rem;
-                        margin-right: .3rem;
+                        border-radius: 8px;
+                        margin-right: 15px;
                     }
                 }
 
                 &:last-child {
                     .van-button {
-                        width: 1.3rem;
-                        height: .5rem;
+                        width: 115px;
+                        height: 25px;
                     }
                 }
             }
@@ -188,20 +188,20 @@
 
                 .title {
                     color: #333;
-                    font-size: .30rem;
+                    font-size: 15px;
                 }
 
                 .desc {
                     color: #666;
-                    font-size: .24rem;
-                    padding: .1rem 0;
+                    font-size: 12px;
+                    padding: 5px 0;
                 }
 
                 .price {
 
                     .buyprice,
                     .sellprice {
-                        padding-bottom: .02rem;
+                        padding-bottom: 1px;
                     }
                 }
             }
@@ -210,44 +210,44 @@
 }
 
 .g-goods-waterfall {
-    padding: .2rem;
+    padding: 10px;
 
     .goods {
         background-color: #fff;
-        border-radius: .12rem;
+        border-radius: 6px;
         overflow: hidden;
 
         &-image {
             display: flex;
             justify-content: center;
             align-items: center;
-            min-height: 2.4rem;
+            min-height: 120px;
             font-size: 0;
         }
 
         &-info {
-            padding: .2rem;
+            padding: 10px;
 
             &__title {
-                font-size: .26rem;
-                margin-bottom: .1rem;
+                font-size: 13px;
+                margin-bottom: 5px;
             }
 
             &__desc {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
-                margin-bottom: .1rem;
+                margin-bottom: 5px;
             }
 
             &__price {
                 color: #f2270c;
 
                 .unit {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .integer {
-                    font-size: .3rem;
+                    font-size: 15px;
                 }
             }
         }
@@ -256,24 +256,24 @@
 
 /* 订单列表 */
 .g-order-list {
-    padding: .2rem;
+    padding: 10px;
     padding-bottom: 0;
 
     &__box {
         &:not(:first-child) {
-            margin-top: .2rem;
+            margin-top: 10px;
         }
 
         background-color: #fff;
-        border-radius: .16rem;
-        padding: .24rem;
+        border-radius: 8px;
+        padding: 12px;
 
     }
 
     &__titlebar {
         display: flex;
         justify-content: space-between;
-        margin-bottom: .2rem;
+        margin-bottom: 10px;
 
         .left {
             h4 {
@@ -281,19 +281,19 @@
             }
 
             span {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
             }
         }
 
         .right {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
         }
     }
 
     &__content {
-        font-size: .24rem;
+        font-size: 12px;
 
         ul {
             display: flex;
@@ -303,14 +303,14 @@
             li {
                 display: flex;
                 justify-content: space-between;
-                line-height: .4rem;
-                width: calc(~"50% - .24rem");
+                line-height: 20px;
+                width: calc(~"50% - 12px");
 
                 span {
                     &:first-child {
                         color: #999;
                         white-space: nowrap;
-                        padding-right: .24rem;
+                        padding-right: 12px;
                     }
                 }
             }
@@ -320,11 +320,11 @@
     &__btnbar {
         display: flex;
         justify-content: flex-end;
-        gap: .16rem;
-        margin-top: .2rem;
+        gap: 8px;
+        margin-top: 10px;
 
         .van-button {
-            width: 1.6rem;
+            width: 80px;
             border-width: 1px;
         }
     }
@@ -340,30 +340,30 @@
             align-items: center;
             color: #fff;
             background-image: linear-gradient(to right, #ee0a24, #ff6034);
-            padding: .2rem .24rem;
+            padding: 10px 12px;
 
             &-left {
                 .price-text {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .price-integer {
-                    font-size: .44rem;
+                    font-size: 22px;
                 }
             }
 
             &-right {
                 display: flex;
                 flex-direction: column;
-                font-size: .24rem;
+                font-size: 12px;
             }
         }
 
         .title {
-            font-size: .3rem;
+            font-size: 15px;
             font-weight: bold;
-            line-height: .48rem;
-            padding: .24rem;
+            line-height: 24px;
+            padding: 12px;
             padding-bottom: 0;
 
             .van-tag {
@@ -371,34 +371,34 @@
             }
 
             span {
-                margin-right: .1rem;
+                margin-right: 5px;
             }
         }
 
         .desc {
-            padding: 0 .24rem;
+            padding: 0 12px;
         }
 
         .qty {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
-            padding: .1rem .24rem 0 .24rem;
+            padding: 5px 12px 0 12px;
         }
 
         .info {
             background-color: #fff;
-            padding: .2rem;
+            padding: 10px;
 
             ul {
                 display: flex;
                 flex-wrap: wrap;
-                font-size: .26rem;
+                font-size: 13px;
 
                 li {
                     display: flex;
                     justify-content: space-between;
                     width: 50%;
-                    padding: .08rem .24rem;
+                    padding: 4px 12px;
 
                     span {
                         &:first-child {
@@ -412,22 +412,22 @@
 
     &__desc {
         background-color: #fff;
-        margin-top: .24rem;
+        margin-top: 12px;
     }
 
     &__footer {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        height: .88rem;
+        height: 44px;
         background-color: #fff;
 
         .price {
-            padding-left: .32rem;
+            padding-left: 16px;
 
             &-text,
             &-unit {
-                font-size: .24rem;
+                font-size: 12px;
             }
 
             &-unit {
@@ -435,7 +435,7 @@
             }
 
             &-integer {
-                font-size: .32rem;
+                font-size: 16px;
                 color: #f2270c;
             }
         }
@@ -450,10 +450,10 @@
                 justify-content: center;
                 align-items: center;
                 height: 100%;
-                min-width: 2rem;
+                min-width: 100px;
                 font-weight: bold;
                 color: #fff;
-                padding: 0 .48rem;
+                padding: 0 24px;
 
                 &.warning {
                     background-image: linear-gradient(to right, #ffd01e, #ff8917);
@@ -478,7 +478,7 @@
     &__stepper {
         display: flex;
         align-items: center;
-        gap: .1rem;
+        gap: 5px;
         width: 100%;
 
         .van-stepper {
@@ -495,12 +495,12 @@
         display: flex;
         flex-wrap: wrap;
         width: 100%;
-        margin-top: .2rem;
+        margin-top: 10px;
     }
 
     .van-radio {
         width: calc(~'100% / 3');
-        padding: .04rem;
+        padding: 2px;
         margin-right: 0;
 
         .van-radio__icon {
@@ -510,12 +510,12 @@
         &__label {
             display: block;
             width: 100%;
-            font-size: .24rem;
+            font-size: 12px;
             text-align: center;
             color: #666;
             border: 1px solid #e5e5e5;
-            border-radius: .08rem;
-            padding: .04rem;
+            border-radius: 4px;
+            padding: 2px;
             margin-left: 0;
         }
 
@@ -531,8 +531,8 @@
 .van {
     &-dialog {
         &__message {
-            font-size: .28rem;
-            line-height: .44rem;
+            font-size: 14px;
+            line-height: 22px;
         }
     }
 

src/packages/qdhs/postcss.config.js

@@ -1,9 +1,10 @@
 module.exports = {
     plugins: {
-        // 'postcss-px-to-viewport': {
-        //     viewportWidth: 375,
-        //     landscape: true,
-        //     landscapeWidth: 980,
-        // },
+        'postcss-px-to-viewport': {
+            viewportWidth: 375,
+            landscape: true, // 是否处理横屏情况
+            landscapeUnit: 'vw', // 横屏时使用的单位
+            landscapeWidth: 844, // 横屏时使用的视口宽度
+        },
     },
 }

src/packages/qdhs/views/goods/detail/index.less

@@ -4,7 +4,7 @@
         align-items: center;
 
         .van-icon {
-            padding: 0 .2rem;
+            padding: 0 10px;
 
             &[disabled='true']{
                 color: rgba(255,255,255,.5)
@@ -16,7 +16,7 @@
         }
 
         .text{
-            font-size: .32rem;
+            font-size: 16px;
         }
     }
 }

src/packages/qdhs/views/home/main/index.less

@@ -3,17 +3,17 @@
 .home-main {
     &__header {
         background: linear-gradient(var(--navbar-background), var(--navbar-background) 60%, transparent 60%);
-        padding: .2rem;
+        padding: 10px;
     }
 
     &__iconbar {
         ul {
             display: flex;
             flex-wrap: wrap;
-            padding-top: .24rem;
+            padding-top: 12px;
 
             &:last-child {
-                padding-bottom: .24rem;
+                padding-bottom: 12px;
             }
 
             li {
@@ -24,12 +24,12 @@
                 text-align: center;
 
                 .g-icon {
-                    width: .72rem;
-                    height: .72rem;
-                    font-size: .44rem;
+                    width: 36px;
+                    height: 36px;
+                    font-size: 22px;
                     color: #fff;
                     border-radius: 50%;
-                    margin-bottom: .08rem;
+                    margin-bottom: 4px;
 
                     &-listing--line {
                         &.m50101 {
@@ -55,7 +55,7 @@
 
     &__titlebar {
         .van-cell__title {
-            font-size: .32rem;
+            font-size: 16px;
             font-weight: bold;
         }
 
@@ -68,7 +68,7 @@
     &__market {
         .scrollbar {
             width: 100%;
-            padding: .2rem;
+            padding: 10px;
         }
 
         .van-swipe {
@@ -80,7 +80,7 @@
                 justify-content: space-around;
                 align-items: center;
                 height: inherit;
-                font-size: .26rem;
+                font-size: 13px;
             }
         }
     }
@@ -96,8 +96,8 @@
 
                 .van-cell__value {
                     flex: initial;
-                    font-size: .24rem;
-                    margin-left: .48rem;
+                    font-size: 12px;
+                    margin-left: 24px;
                 }
             }
         }

src/packages/qdhs/views/mine/index.less

@@ -1,7 +1,7 @@
 @import '@mobile/assets/themes/base/mixin.less';
 
 .mine {
-    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 3rem, transparent 3rem);
+    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 150px, transparent 150px);
 
     .app-navbar {
         background-image: @backgroundImage;
@@ -16,13 +16,13 @@
         color: #000;
         background-color: #fff;
         background-image: @backgroundImage;
-        padding: 0 .36rem;
+        padding: 0 18px;
 
         &__wrapper {
             background-color: #fff;
-            border-top-left-radius: .2rem;
-            border-top-right-radius: .2rem;
-            padding: .24rem;
+            border-top-left-radius: 10px;
+            border-top-right-radius: 10px;
+            padding: 12px;
         }
 
         .profile {
@@ -34,21 +34,21 @@
                 align-items: center;
 
                 .g-image--avatar {
-                    width: .8rem;
-                    height: .8rem;
+                    width: 40px;
+                    height: 40px;
                     border-radius: 50%;
                     font-size: 0;
-                    margin-right: .16rem;
+                    margin-right: 8px;
                 }
 
                 &__info {
                     flex: 1;
-                    padding-right: .32rem;
+                    padding-right: 16px;
 
                     .top {
                         display: flex;
                         align-items: center;
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #A1B1C5;
 
                         span {
@@ -57,13 +57,13 @@
 
                         .van-icon {
                             line-height: normal;
-                            margin-left: .04rem;
+                            margin-left: 2px;
                         }
                     }
 
                     .bottom {
-                        line-height: .4rem;
-                        font-size: .3rem;
+                        line-height: 20px;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -75,21 +75,21 @@
                 justify-content: center;
 
                 span {
-                    line-height: .4rem;
+                    line-height: 20px;
 
                     &:first-child {
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #46D63C;
 
                         &::before {
                             content: '资金账户';
                             color: #A1B1C5;
-                            margin-right: .12rem;
+                            margin-right: 6px;
                         }
                     }
 
                     &:last-child {
-                        font-size: .3rem;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -99,24 +99,24 @@
         .bank {
             display: flex;
             justify-content: space-around;
-            padding: .36rem 0;
+            padding: 18px 0;
 
             ul {
                 li {
                     display: flex;
                     flex-direction: column;
-                    padding-bottom: .1rem;
+                    padding-bottom: 5px;
 
                     span {
-                        line-height: .4rem;
+                        line-height: 20px;
 
                         &:first-child {
-                            font-size: .24rem;
+                            font-size: 12px;
                             color: #A1B1C5;
                         }
 
                         &:last-child {
-                            font-size: .3rem;
+                            font-size: 15px;
                             font-weight: bold;
                         }
                     }
@@ -129,8 +129,8 @@
             justify-content: space-around;
 
             .van-button {
-                width: 2.8rem;
-                box-shadow: 0 .06rem .14rem 0 #e0e2e8;
+                width: 140px;
+                box-shadow: 0 3px 7px 0 #e0e2e8;
             }
         }
     }
@@ -139,7 +139,7 @@
         ul {
             display: flex;
             background-color: #fff;
-            padding: .24rem;
+            padding: 12px;
 
             li {
                 flex: 1;
@@ -148,8 +148,8 @@
                 align-items: center;
 
                 .g-icon {
-                    font-size: .56rem;
-                    margin-bottom: .04rem;
+                    font-size: 28px;
+                    margin-bottom: 2px;
                 }
             }
         }
@@ -157,7 +157,7 @@
 
     &-footer {
         text-align: center;
-        padding: .2rem 0;
+        padding: 10px 0;
 
         .button-logout {
             width: 50%;

src/packages/qxst/assets/themes/default/default.less

@@ -16,7 +16,7 @@
     --color-down: #04c786;
 
     /* 导航栏 */
-    --navbar-height: .88rem;
+    --navbar-height: 44px;
     --navbar-color: #fff;
     --navbar-background: #C30D23;
     --navbar-backbutton-color: #fff;
@@ -27,7 +27,7 @@
     --tabbar-icon-active: #c30d23;
 
     /* 内容边距 */
-    --content-inset: .24rem;
+    --content-inset: 12px;
 
     /* Vant-Button */
     --van-button-border-width: 0;
@@ -52,12 +52,12 @@
                 align-items: center;
                 color: #626675;
                 cursor: pointer;
-                border-radius: .04rem;
+                border-radius: 2px;
                 background-color: #f0f0f1;
-                padding: .08rem .16rem;
+                padding: 4px 8px;
 
                 &:not(:first-child) {
-                    margin-left: .1rem;
+                    margin-left: 5px;
                 }
 
                 &.is-active {

src/packages/qxst/assets/themes/global/global.less

@@ -51,16 +51,16 @@
     &__container {
         display: flex;
         flex-direction: column;
-        padding-bottom: .32rem;
+        padding-bottom: 16px;
 
         /* 父元素的第一个子元素 */
         .van-cell-group--inset:first-of-type {
-            margin-top: .32rem;
+            margin-top: 16px;
         }
 
         /* 相邻兄弟元素 */
         .van-cell-group--inset+.van-cell-group--inset {
-            margin-top: .24rem;
+            margin-top: 12px;
         }
 
         .van-field {
@@ -85,8 +85,8 @@
         }
 
         &.inset {
-            gap: .2rem;
-            padding: .2rem .32rem;
+            gap: 10px;
+            padding: 10px 16px;
         }
     }
 }
@@ -132,33 +132,33 @@
 .g-navmenu {
     .app-iconfont {
         .g-icon {
-            width: .36rem;
-            height: .36rem;
-            font-size: .36rem;
+            width: 18px;
+            height: 18px;
+            font-size: 18px;
         }
 
         &__label {
-            margin-left: .24rem;
+            margin-left: 12px;
         }
     }
 }
 
 /* 商品列表 */
 .g-goods-list {
-    padding: .2rem;
+    padding: 10px;
 
     .list {
-        padding: .2rem .2rem 0 .2rem;
+        padding: 10px 10px 0 10px;
 
         &-item {
             display: flex;
             align-items: center;
-            border-radius: .1rem;
+            border-radius: 5px;
             overflow: hidden;
-            padding: .2rem;
+            padding: 10px;
 
             &:not(:last-child) {
-                margin-bottom: .2rem;
+                margin-bottom: 10px;
             }
 
             .img {
@@ -167,18 +167,18 @@
                     align-items: center;
 
                     img {
-                        width: 1.8rem;
-                        height: 1.8rem;
+                        width: 90px;
+                        height: 90px;
                         object-fit: cover;
-                        border-radius: .16rem;
-                        margin-right: .3rem;
+                        border-radius: 8px;
+                        margin-right: 15px;
                     }
                 }
 
                 &:last-child {
                     .van-button {
-                        width: 1.3rem;
-                        height: .5rem;
+                        width: 65px;
+                        height: 25px;
                     }
                 }
             }
@@ -188,20 +188,20 @@
 
                 .title {
                     color: #333;
-                    font-size: .30rem;
+                    font-size: 15px;
                 }
 
                 .desc {
                     color: #666;
-                    font-size: .24rem;
-                    padding: .1rem 0;
+                    font-size: 12px;
+                    padding: 5px 0;
                 }
 
                 .price {
 
                     .buyprice,
                     .sellprice {
-                        padding-bottom: .02rem;
+                        padding-bottom: 1px;
                     }
                 }
             }
@@ -210,44 +210,44 @@
 }
 
 .g-goods-waterfall {
-    padding: .2rem;
+    padding: 10px;
 
     .goods {
         background-color: #fff;
-        border-radius: .12rem;
+        border-radius: 6px;
         overflow: hidden;
 
         &-image {
             display: flex;
             justify-content: center;
             align-items: center;
-            min-height: 2.4rem;
+            min-height: 120px;
             font-size: 0;
         }
 
         &-info {
-            padding: .2rem;
+            padding: 10px;
 
             &__title {
-                font-size: .26rem;
-                margin-bottom: .1rem;
+                font-size: 13px;
+                margin-bottom: 5px;
             }
 
             &__desc {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
-                margin-bottom: .1rem;
+                margin-bottom: 5px;
             }
 
             &__price {
                 color: #f2270c;
 
                 .unit {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .integer {
-                    font-size: .3rem;
+                    font-size: 15px;
                 }
             }
         }
@@ -256,24 +256,24 @@
 
 /* 订单列表 */
 .g-order-list {
-    padding: .2rem;
+    padding: 10px;
     padding-bottom: 0;
 
     &__box {
         &:not(:first-child) {
-            margin-top: .2rem;
+            margin-top: 10px;
         }
 
         background-color: #fff;
-        border-radius: .16rem;
-        padding: .24rem;
+        border-radius: 8px;
+        padding: 12px;
 
     }
 
     &__titlebar {
         display: flex;
         justify-content: space-between;
-        margin-bottom: .2rem;
+        margin-bottom: 10px;
 
         .left {
             h4 {
@@ -281,19 +281,19 @@
             }
 
             span {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
             }
         }
 
         .right {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
         }
     }
 
     &__content {
-        font-size: .24rem;
+        font-size: 12px;
 
         ul {
             display: flex;
@@ -303,14 +303,14 @@
             li {
                 display: flex;
                 justify-content: space-between;
-                line-height: .4rem;
-                width: calc(~"50% - .24rem");
+                line-height: 20px;
+                width: calc(~"50% - 12px");
 
                 span {
                     &:first-child {
                         color: #999;
                         white-space: nowrap;
-                        padding-right: .24rem;
+                        padding-right: 12px;
                     }
                 }
             }
@@ -320,11 +320,11 @@
     &__btnbar {
         display: flex;
         justify-content: flex-end;
-        gap: .16rem;
-        margin-top: .2rem;
+        gap: 8px;
+        margin-top: 10px;
 
         .van-button {
-            width: 1.6rem;
+            width: 80px;
             border-width: 1px;
         }
     }
@@ -340,30 +340,30 @@
             align-items: center;
             color: #fff;
             background-image: linear-gradient(to right, #ee0a24, #ff6034);
-            padding: .2rem .24rem;
+            padding: 10px 12px;
 
             &-left {
                 .price-text {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .price-integer {
-                    font-size: .44rem;
+                    font-size: 22px;
                 }
             }
 
             &-right {
                 display: flex;
                 flex-direction: column;
-                font-size: .24rem;
+                font-size: 12px;
             }
         }
 
         .title {
-            font-size: .3rem;
+            font-size: 15px;
             font-weight: bold;
-            line-height: .48rem;
-            padding: .24rem;
+            line-height: 24px;
+            padding: 12px;
             padding-bottom: 0;
 
             .van-tag {
@@ -371,34 +371,34 @@
             }
 
             span {
-                margin-right: .1rem;
+                margin-right: 5px;
             }
         }
 
         .desc {
-            padding: 0 .24rem;
+            padding: 0 12px;
         }
 
         .qty {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
-            padding: .1rem .24rem 0 .24rem;
+            padding: 5px 12px 0 12px;
         }
 
         .info {
             background-color: #fff;
-            padding: .2rem;
+            padding: 10px;
 
             ul {
                 display: flex;
                 flex-wrap: wrap;
-                font-size: .26rem;
+                font-size: 13px;
 
                 li {
                     display: flex;
                     justify-content: space-between;
                     width: 50%;
-                    padding: .08rem .24rem;
+                    padding: 4px 12px;
 
                     span {
                         &:first-child {
@@ -412,22 +412,22 @@
 
     &__desc {
         background-color: #fff;
-        margin-top: .24rem;
+        margin-top: 12px;
     }
 
     &__footer {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        height: .88rem;
+        height: 44px;
         background-color: #fff;
 
         .price {
-            padding-left: .32rem;
+            padding-left: 16px;
 
             &-text,
             &-unit {
-                font-size: .24rem;
+                font-size: 12px;
             }
 
             &-unit {
@@ -435,7 +435,7 @@
             }
 
             &-integer {
-                font-size: .32rem;
+                font-size: 16px;
                 color: #f2270c;
             }
         }
@@ -450,10 +450,10 @@
                 justify-content: center;
                 align-items: center;
                 height: 100%;
-                min-width: 2rem;
+                min-width: 100px;
                 font-weight: bold;
                 color: #fff;
-                padding: 0 .48rem;
+                padding: 0 24px;
 
                 &.warning {
                     background-image: linear-gradient(to right, #ffd01e, #ff8917);
@@ -478,7 +478,7 @@
     &__stepper {
         display: flex;
         align-items: center;
-        gap: .1rem;
+        gap: 5px;
         width: 100%;
 
         .van-stepper {
@@ -495,12 +495,12 @@
         display: flex;
         flex-wrap: wrap;
         width: 100%;
-        margin-top: .2rem;
+        margin-top: 10px;
     }
 
     .van-radio {
         width: calc(~'100% / 3');
-        padding: .04rem;
+        padding: 2px;
         margin-right: 0;
 
         .van-radio__icon {
@@ -510,12 +510,12 @@
         &__label {
             display: block;
             width: 100%;
-            font-size: .24rem;
+            font-size: 12px;
             text-align: center;
             color: #666;
             border: 1px solid #e5e5e5;
-            border-radius: .08rem;
-            padding: .04rem;
+            border-radius: 4px;
+            padding: 2px;
             margin-left: 0;
         }
 
@@ -531,8 +531,8 @@
 .van {
     &-dialog {
         &__message {
-            font-size: .28rem;
-            line-height: .44rem;
+            font-size: 14px;
+            line-height: 22px;
         }
     }
 

src/packages/qxst/postcss.config.js

@@ -1,9 +1,10 @@
 module.exports = {
     plugins: {
-        // 'postcss-px-to-viewport': {
-        //     viewportWidth: 375,
-        //     landscape: true,
-        //     landscapeWidth: 980,
-        // },
+        'postcss-px-to-viewport': {
+            viewportWidth: 375,
+            landscape: true, // 是否处理横屏情况
+            landscapeUnit: 'vw', // 横屏时使用的单位
+            landscapeWidth: 844, // 横屏时使用的视口宽度
+        },
     },
 }

src/packages/qxst/views/mine/index.less

@@ -1,7 +1,7 @@
 @import '@mobile/assets/themes/base/mixin.less';
 
 .mine {
-    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 3rem, transparent 3rem);
+    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 150px, transparent 150px);
 
     .app-navbar {
         background-image: @backgroundImage;
@@ -16,13 +16,13 @@
         color: #000;
         background-color: #fff;
         background-image: @backgroundImage;
-        padding: 0 .36rem;
+        padding: 0 18px;
 
         &__wrapper {
             background-color: #fff;
-            border-top-left-radius: .2rem;
-            border-top-right-radius: .2rem;
-            padding: .24rem;
+            border-top-left-radius: 10px;
+            border-top-right-radius: 10px;
+            padding: 12px;
         }
 
         .profile {
@@ -34,21 +34,21 @@
                 align-items: center;
 
                 .g-image--avatar {
-                    width: .8rem;
-                    height: .8rem;
+                    width: 40px;
+                    height: 40px;
                     border-radius: 50%;
                     font-size: 0;
-                    margin-right: .16rem;
+                    margin-right: 8px;
                 }
 
                 &__info {
                     flex: 1;
-                    padding-right: .32rem;
+                    padding-right: 16px;
 
                     .top {
                         display: flex;
                         align-items: center;
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #A1B1C5;
 
                         span {
@@ -57,13 +57,13 @@
 
                         .van-icon {
                             line-height: normal;
-                            margin-left: .04rem;
+                            margin-left: 2px;
                         }
                     }
 
                     .bottom {
-                        line-height: .4rem;
-                        font-size: .3rem;
+                        line-height: 20px;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -75,21 +75,21 @@
                 justify-content: center;
 
                 span {
-                    line-height: .4rem;
+                    line-height: 20px;
 
                     &:first-child {
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #46D63C;
 
                         &::before {
                             content: '资金账户';
                             color: #A1B1C5;
-                            margin-right: .12rem;
+                            margin-right: 6px;
                         }
                     }
 
                     &:last-child {
-                        font-size: .3rem;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -99,24 +99,24 @@
         .bank {
             display: flex;
             justify-content: space-around;
-            padding: .36rem 0;
+            padding: 18px 0;
 
             ul {
                 li {
                     display: flex;
                     flex-direction: column;
-                    padding-bottom: .1rem;
+                    padding-bottom: 5px;
 
                     span {
-                        line-height: .4rem;
+                        line-height: 20px;
 
                         &:first-child {
-                            font-size: .24rem;
+                            font-size: 12px;
                             color: #A1B1C5;
                         }
 
                         &:last-child {
-                            font-size: .3rem;
+                            font-size: 15px;
                             font-weight: bold;
                         }
                     }
@@ -129,8 +129,8 @@
             justify-content: space-around;
 
             .van-button {
-                width: 2.8rem;
-                box-shadow: 0 .06rem .14rem 0 #e0e2e8;
+                width: 140px;
+                box-shadow: 0 3px 7px 0 #e0e2e8;
             }
         }
     }
@@ -139,7 +139,7 @@
         ul {
             display: flex;
             background-color: #fff;
-            padding: .24rem;
+            padding: 12px;
 
             li {
                 flex: 1;
@@ -148,8 +148,8 @@
                 align-items: center;
 
                 .g-icon {
-                    font-size: .56rem;
-                    margin-bottom: .04rem;
+                    font-size: 28px;
+                    margin-bottom: 2px;
                 }
             }
         }
@@ -157,7 +157,7 @@
 
     &-footer {
         text-align: center;
-        padding: .2rem 0;
+        padding: 10px 0;
 
         .button-logout {
             width: 50%;

src/packages/qxst/views/user/login/index.less

@@ -3,7 +3,7 @@
 
     &-logo {
         img {
-            height: 1.3rem;
+            height: 65px;
         }
     }
 }

src/packages/sbyj/assets/themes/default/default.less

@@ -16,7 +16,7 @@
     --color-down: #04c786;
 
     /* 导航栏 */
-    --navbar-height: .88rem;
+    --navbar-height: 44px;
     --navbar-color: #fff;
     --navbar-background: var(--color-primary);
     --navbar-backbutton-color: #fff;
@@ -27,7 +27,7 @@
     --tabbar-icon-active: #f7dc51;
 
     /* 内容边距 */
-    --content-inset: .24rem;
+    --content-inset: 12px;
 
     /* Vant-Button */
     --van-button-border-width: 0;
@@ -52,12 +52,12 @@
                 align-items: center;
                 color: #626675;
                 cursor: pointer;
-                border-radius: .04rem;
+                border-radius: 2px;
                 background-color: #f0f0f1;
-                padding: .08rem .16rem;
+                padding: 4px 8px;
 
                 &:not(:first-child) {
-                    margin-left: .1rem;
+                    margin-left: 5px;
                 }
 
                 &.is-active {

src/packages/sbyj/assets/themes/global/global.less

@@ -51,16 +51,16 @@
     &__container {
         display: flex;
         flex-direction: column;
-        padding-bottom: .32rem;
+        padding-bottom: 16px;
 
         /* 父元素的第一个子元素 */
         .van-cell-group--inset:first-of-type {
-            margin-top: .32rem;
+            margin-top: 16px;
         }
 
         /* 相邻兄弟元素 */
         .van-cell-group--inset+.van-cell-group--inset {
-            margin-top: .24rem;
+            margin-top: 12px;
         }
 
         .van-field {
@@ -85,8 +85,8 @@
         }
 
         &.inset {
-            gap: .2rem;
-            padding: .2rem .32rem;
+            gap: 10px;
+            padding: 10px 16px;
         }
     }
 }
@@ -132,51 +132,51 @@
 .g-navmenu {
     .app-iconfont {
         .g-icon {
-            width: .36rem;
-            height: .36rem;
-            font-size: .36rem;
+            width: 18px;
+            height: 18px;
+            font-size: 18px;
         }
 
         &__label {
-            margin-left: .24rem;
+            margin-left: 12px;
         }
     }
 }
 
 /* 商品列表 */
 .g-goods-list {
-    padding: .2rem;
+    padding: 10px;
 
     .goods {
         background-color: #fff;
-        border-radius: .12rem;
+        border-radius: 6px;
         overflow: hidden;
 
         &-image {
             display: flex;
             justify-content: center;
             align-items: center;
-            min-height: 2.4rem;
+            min-height: 120px;
             font-size: 0;
         }
 
         &-info {
-            padding: .2rem;
+            padding: 10px;
 
             &__title {
-                font-size: .26rem;
-                margin-bottom: .1rem;
+                font-size: 13px;
+                margin-bottom: 5px;
             }
 
             &__price {
                 color: #f2270c;
 
                 .unit {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .integer {
-                    font-size: .3rem;
+                    font-size: 15px;
                 }
             }
         }
@@ -185,24 +185,24 @@
 
 /* 订单列表 */
 .g-order-list {
-    padding: .2rem;
+    padding: 10px;
     padding-bottom: 0;
 
     &__box {
         &:not(:first-child) {
-            margin-top: .2rem;
+            margin-top: 10px;
         }
 
         background-color: #fff;
-        border-radius: .16rem;
-        padding: .24rem;
+        border-radius: 8px;
+        padding: 12px;
 
     }
 
     &__titlebar {
         display: flex;
         justify-content: space-between;
-        margin-bottom: .2rem;
+        margin-bottom: 10px;
 
         .left {
             h4 {
@@ -210,19 +210,19 @@
             }
 
             span {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
             }
         }
 
         .right {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
         }
     }
 
     &__content {
-        font-size: .24rem;
+        font-size: 12px;
 
         ul {
             display: flex;
@@ -232,14 +232,14 @@
             li {
                 display: flex;
                 justify-content: space-between;
-                line-height: .4rem;
-                width: calc(~"50% - .24rem");
+                line-height: 20px;
+                width: calc(~"50% - 12px");
 
                 span {
                     &:first-child {
                         color: #999;
                         white-space: nowrap;
-                        padding-right: .24rem;
+                        padding-right: 12px;
                     }
                 }
             }
@@ -249,11 +249,11 @@
     &__btnbar {
         display: flex;
         justify-content: flex-end;
-        gap: .16rem;
-        margin-top: .2rem;
+        gap: 8px;
+        margin-top: 10px;
 
         .van-button {
-            width: 1.6rem;
+            width: 80px;
             border-width: 1px;
         }
     }
@@ -269,30 +269,30 @@
             align-items: center;
             color: #fff;
             background-image: linear-gradient(to right, #ee0a24, #ff6034);
-            padding: .2rem .24rem;
+            padding: 10px 12px;
 
             &-left {
                 .price-text {
-                    font-size: .24rem;
+                    font-size: 14px;
                 }
 
                 .price-integer {
-                    font-size: .44rem;
+                    font-size: 22px;
                 }
             }
 
             &-right {
                 display: flex;
                 flex-direction: column;
-                font-size: .24rem;
+                font-size: 12px;
             }
         }
 
         .title {
-            font-size: .3rem;
+            font-size: 15px;
             font-weight: bold;
-            line-height: .48rem;
-            padding: .24rem;
+            line-height: 24px;
+            padding: 12px;
             padding-bottom: 0;
 
             .van-tag {
@@ -300,30 +300,30 @@
             }
 
             span {
-                margin-right: .1rem;
+                margin-right: 5px;
             }
         }
 
         .qty {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
-            padding: .1rem .24rem 0 .24rem;
+            padding: 5px 12px 0 12px;
         }
 
         .info {
             background-color: #fff;
-            padding: .2rem;
+            padding: 10px;
 
             ul {
                 display: flex;
                 flex-wrap: wrap;
-                font-size: .26rem;
+                font-size: 13px;
 
                 li {
                     display: flex;
                     justify-content: space-between;
                     width: 50%;
-                    padding: .08rem .24rem;
+                    padding: 4px 12px;
 
                     span {
                         &:first-child {
@@ -337,22 +337,22 @@
 
     &__desc {
         background-color: #fff;
-        margin-top: .24rem;
+        margin-top: 12px;
     }
 
     &__footer {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        height: .88rem;
+        height: 44px;
         background-color: #fff;
 
         .price {
-            padding-left: .32rem;
+            padding-left: 16px;
 
             &-text,
             &-unit {
-                font-size: .24rem;
+                font-size: 12px;
             }
 
             &-unit {
@@ -360,7 +360,7 @@
             }
 
             &-integer {
-                font-size: .32rem;
+                font-size: 16px;
                 color: #f2270c;
             }
         }
@@ -375,10 +375,10 @@
                 justify-content: center;
                 align-items: center;
                 height: 100%;
-                min-width: 2rem;
+                min-width: 100px;
                 font-weight: bold;
                 color: #fff;
-                padding: 0 .48rem;
+                padding: 0 24px;
 
                 &.warning {
                     background-image: linear-gradient(to right, #ffd01e, #ff8917);
@@ -403,7 +403,7 @@
     &__stepper {
         display: flex;
         align-items: center;
-        gap: .1rem;
+        gap: 5px;
         width: 100%;
 
         .van-stepper {
@@ -420,12 +420,12 @@
         display: flex;
         flex-wrap: wrap;
         width: 100%;
-        margin-top: .2rem;
+        margin-top: 10px;
     }
 
     .van-radio {
         width: 25%;
-        padding: .04rem;
+        padding: 2px;
         margin-right: 0;
 
         .van-radio__icon {
@@ -435,12 +435,12 @@
         &__label {
             display: block;
             width: 100%;
-            font-size: .24rem;
+            font-size: 12px;
             text-align: center;
             color: #666;
             border: 1px solid #e5e5e5;
-            border-radius: .08rem;
-            padding: .04rem;
+            border-radius: 4px;
+            padding: 2px;
             margin-left: 0;
         }
 
@@ -456,8 +456,8 @@
 .van {
     &-dialog {
         &__message {
-            font-size: .28rem;
-            line-height: .44rem;
+            font-size: 14px;
+            line-height: 22px;
         }
     }
 

src/packages/sbyj/postcss.config.js

@@ -1,9 +1,10 @@
 module.exports = {
     plugins: {
-        // 'postcss-px-to-viewport': {
-        //     viewportWidth: 375,
-        //     landscape: true,
-        //     landscapeWidth: 980,
-        // },
+        'postcss-px-to-viewport': {
+            viewportWidth: 375,
+            landscape: true, // 是否处理横屏情况
+            landscapeUnit: 'vw', // 横屏时使用的单位
+            landscapeWidth: 844, // 横屏时使用的视口宽度
+        },
     },
 }

src/packages/sbyj/views/delivery/components/processing/components/files/index.vue

@@ -71,12 +71,12 @@ const { loading, pageIndex, pageCount, run } = useRequest(queryMyDeliveryOffline
             &:first-child {
                 span:last-child {
                     color: #999;
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
             }
 
             &:not(:first-child) {
-                font-size: .32rem;
+                font-size: 16px;
             }
         }
     }

src/packages/sbyj/views/delivery/components/processing/components/pay-detail/index.vue

@@ -88,12 +88,12 @@ defineExpose({
             &:first-child {
                 span:last-child {
                     color: #999;
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
             }
 
             &:not(:first-child) {
-                font-size: .32rem;
+                font-size: 16px;
             }
         }
     }

src/packages/sbyj/views/delivery/detail/file-list/index.vue

@@ -14,8 +14,8 @@
                                 <template #value>
                                     <div v-for="(url, index) in getImages(item.fileaddress)" :key="index"
                                         @click="showImagePreview(getImages(item.fileaddress))">
-                                        <Image width=".72rem" height=".72rem" fit="cover" :src="url"
-                                            style="margin-left: .1rem;" v-if="index < 3" />
+                                        <Image width="36px" height="36px" fit="cover" :src="url"
+                                            style="margin-left: 5px;" v-if="index < 3" />
                                     </div>
                                 </template>
                             </Cell>

src/packages/sbyj/views/home/main/index.less

@@ -4,13 +4,13 @@
     &__banner {
         position: relative;
         overflow: hidden;
-        padding: .32rem;
+        padding: 16px;
         padding-bottom: 0;
 
         &::before {
             content: '';
             width: 140%;
-            height: 3rem;
+            height: 15px;
             position: absolute;
             left: -20%;
             top: 0;
@@ -21,7 +21,7 @@
         .app-banner {
             position: relative;
             z-index: 1;
-            border-radius: .2rem;
+            border-radius: 10px;
             overflow: hidden;
         }
     }
@@ -30,10 +30,10 @@
         ul {
             display: flex;
             flex-wrap: wrap;
-            padding-top: .24rem;
+            padding-top: 12px;
 
             &:last-child {
-                padding-bottom: .24rem;
+                padding-bottom: 12px;
             }
 
             li {
@@ -44,12 +44,12 @@
                 text-align: center;
 
                 .g-icon {
-                    width: .84rem;
-                    height: .84rem;
-                    font-size: .48rem;
+                    width: 42px;
+                    height: 42px;
+                    font-size: 24px;
                     color: #fff;
                     border-radius: 50%;
-                    margin-bottom: .08rem;
+                    margin-bottom: 4px;
 
                     &-quote--line {
                         background-color: #79b933;
@@ -72,21 +72,21 @@
             display: flex;
             align-items: center;
             line-height: 1;
-            font-size: .32rem;
+            font-size: 16px;
             font-weight: bold;
 
             img {
-                width: .32rem;
-                height: .32rem;
-                margin-right: .1rem;
+                width: 16px;
+                height: 16px;
+                margin-right: 5px;
             }
 
             span {
                 +span {
                     color: #999;
-                    font-size: .26rem;
+                    font-size: 13px;
                     font-weight: normal;
-                    margin-left: .1rem;
+                    margin-left: 5px;
                 }
             }
         }
@@ -108,8 +108,8 @@
 
                 .van-cell__value {
                     flex: initial;
-                    font-size: .24rem;
-                    margin-left: .48rem;
+                    font-size: 12px;
+                    margin-left: 24px;
                 }
             }
         }

src/packages/sbyj/views/market/detail/index.less

@@ -1,24 +1,24 @@
 .market-detail {
     &__form {
         background-color: #fff;
-        border-radius: .16rem;
-        margin: .2rem;
+        border-radius: 8px;
+        margin: 10px;
         margin-bottom: 0;
 
         .form-price {
             display: flex;
-            padding: .32rem 0;
+            padding: 16px 0;
 
             dl {
                 flex: 1;
                 text-align: center;
 
                 dt {
-                    margin-bottom: .1rem;
+                    margin-bottom: 5px;
                 }
 
                 dd {
-                    font-size: .56rem;
+                    font-size: 28px;
                     font-weight: bold;
                 }
             }
@@ -26,8 +26,8 @@
 
         .form-submit {
             display: flex;
-            gap: .32rem;
-            padding: .32rem;
+            gap: 16px;
+            padding: 16px;
         }
 
         .g-qty-group {
@@ -37,18 +37,18 @@
                 .van-stepper {
                     &__input {
                         flex: 1;
-                        font-size: .32rem;
+                        font-size: 16px;
                     }
 
                     &__minus,
                     &__plus,
                     &__input {
-                        height: .72rem;
+                        height: 36px;
                     }
 
                     &__minus,
                     &__plus {
-                        width: .72rem;
+                        width: 36px;
                     }
                 }
             }
@@ -57,7 +57,7 @@
 
     &__list {
         .g-order-list {
-            padding: .2rem;
+            padding: 10px;
         }
     }
 }

src/packages/sbyj/views/market/list/index.less

@@ -1,7 +1,7 @@
 .market {
     &-header {
         .app-statusbar {
-            height: 2.94rem;
+            height: 147px;
             background: url('../../../assets/images/market-title-bg.jpg') no-repeat center top;
             background-size: 100% auto;
         }
@@ -9,8 +9,8 @@
 
     &-title {
         color: #999;
-        font-size: .26rem;
-        padding: .24rem;
+        font-size: 13px;
+        padding: 12px;
     }
 
     &-table {
@@ -21,34 +21,34 @@
             color: #999;
             font-weight: normal;
             text-align: left;
-            padding: .16rem .1rem;
+            padding: 8px 5px;
 
             &:first-child {
-                padding-left: .24rem;
+                padding-left: 12px;
             }
 
             &:last-child {
-                padding-right: .24rem;
+                padding-right: 12px;
             }
 
             &.title {
                 color: #999;
                 background-color: #f6f6f6;
-                padding: .24rem;
+                padding: 12px;
             }
         }
 
         td {
-            font-size: .32rem;
+            font-size: 16px;
             border-top: 1px solid #eee;
-            padding: .12rem;
+            padding: 6px;
 
             &:first-child {
-                padding-left: .24rem;
+                padding-left: 12px;
             }
 
             &:last-child {
-                padding-right: .24rem;
+                padding-right: 12px;
             }
 
             span {

src/packages/sbyj/views/mine/index.less

@@ -1,7 +1,7 @@
 @import '@mobile/assets/themes/base/mixin.less';
 
 .mine {
-    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 3rem, transparent 3rem);
+    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 150px, transparent 150px);
 
     .app-navbar {
         background-image: @backgroundImage;
@@ -16,13 +16,13 @@
         color: #000;
         background-color: #fff;
         background-image: @backgroundImage;
-        padding: 0 .36rem;
+        padding: 0 18px;
 
         &__wrapper {
             background-color: #fff;
-            border-top-left-radius: .2rem;
-            border-top-right-radius: .2rem;
-            padding: .24rem;
+            border-top-left-radius: 10px;
+            border-top-right-radius: 10px;
+            padding: 12px;
         }
 
         .profile {
@@ -34,21 +34,21 @@
                 align-items: center;
 
                 .g-image--avatar {
-                    width: .8rem;
-                    height: .8rem;
+                    width: 40px;
+                    height: 40px;
                     border-radius: 50%;
                     font-size: 0;
-                    margin-right: .16rem;
+                    margin-right: 8px;
                 }
 
                 &__info {
                     flex: 1;
-                    padding-right: .32rem;
+                    padding-right: 16px;
 
                     .top {
                         display: flex;
                         align-items: center;
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #A1B1C5;
 
                         span {
@@ -57,13 +57,13 @@
 
                         .van-icon {
                             line-height: normal;
-                            margin-left: .04rem;
+                            margin-left: 2px;
                         }
                     }
 
                     .bottom {
-                        line-height: .4rem;
-                        font-size: .3rem;
+                        line-height: 20px;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -75,21 +75,21 @@
                 justify-content: center;
 
                 span {
-                    line-height: .4rem;
+                    line-height: 20px;
 
                     &:first-child {
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #46D63C;
 
                         &::before {
                             content: '资金账户';
                             color: #A1B1C5;
-                            margin-right: .12rem;
+                            margin-right: 6px;
                         }
                     }
 
                     &:last-child {
-                        font-size: .3rem;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -99,24 +99,24 @@
         .bank {
             display: flex;
             justify-content: space-around;
-            padding: .36rem 0;
+            padding: 18px 0;
 
             ul {
                 li {
                     display: flex;
                     flex-direction: column;
-                    padding-bottom: .1rem;
+                    padding-bottom: 5px;
 
                     span {
-                        line-height: .4rem;
+                        line-height: 20px;
 
                         &:first-child {
-                            font-size: .24rem;
+                            font-size: 12px;
                             color: #A1B1C5;
                         }
 
                         &:last-child {
-                            font-size: .3rem;
+                            font-size: 15px;
                             font-weight: bold;
                         }
                     }
@@ -129,8 +129,8 @@
             justify-content: space-around;
 
             .van-button {
-                width: 2.8rem;
-                box-shadow: 0 .06rem .14rem 0 #e0e2e8;
+                width: 140px;
+                box-shadow: 0 3px 7px 0 #e0e2e8;
             }
         }
     }
@@ -139,7 +139,7 @@
         ul {
             display: flex;
             background-color: #fff;
-            padding: .24rem;
+            padding: 12px;
 
             li {
                 flex: 1;
@@ -148,8 +148,8 @@
                 align-items: center;
 
                 .g-icon {
-                    font-size: .56rem;
-                    margin-bottom: .04rem;
+                    font-size: 28px;
+                    margin-bottom: 2px;
                 }
             }
         }
@@ -157,7 +157,7 @@
 
     &-footer {
         text-align: center;
-        padding: .2rem 0;
+        padding: 10px 0;
 
         .button-logout {
             width: 50%;

src/packages/sbyj/views/order/list/components/close-holder/index.less

@@ -1,18 +1,18 @@
 .g-form {
     .form-price {
         display: flex;
-        padding: .32rem 0;
+        padding: 16px 0;
     
         dl {
             flex: 1;
             text-align: center;
     
             dt {
-                margin-bottom: .1rem;
+                margin-bottom: 5px;
             }
     
             dd {
-                font-size: .56rem;
+                font-size: 28px;
                 font-weight: bold;
             }
         }

src/packages/sbyj/views/user/login/index.less

@@ -10,7 +10,7 @@
         top: 0;
         left: -20%;
         width: 140%;
-        height: 4rem;
+        height: 200px;
         border-radius: 0 0 50% 50%;
         background: linear-gradient(35deg, #243862, #3e5ea2);
     }
@@ -19,10 +19,10 @@
         position: relative;
         z-index: 0;
         text-align: center;
-        padding: 1rem 0;
+        padding: 5px 0;
 
         img {
-            height: .48rem;
+            height: 24px;
         }
     }
 
@@ -30,10 +30,10 @@
         position: relative;
         z-index: 0;
         background-color: #fff;
-        box-shadow: 0 0 .72rem 0 rgba(15, 42, 95, .15);
-        border-radius: .32rem;
-        padding: .32rem;
-        margin: 0 .36rem;
+        box-shadow: 0 0 36px 0 rgba(15, 42, 95, .15);
+        border-radius: 16px;
+        padding: 16px;
+        margin: 0 18px;
 
         .van-cell {
             &::after {
@@ -48,8 +48,8 @@
         .van-field {
             &__control {
                 background-color: #f3f8fa;
-                border-radius: .1rem;
-                padding: .12rem .2rem;
+                border-radius: 5px;
+                padding: 6px 10px;
             }
         }
     }
@@ -58,14 +58,14 @@
         display: flex;
         justify-content: space-between;
         color: #888;
-        font-size: .26rem;
-        padding: .28rem .48rem;
-        margin: 0 .48rem;
+        font-size: 13px;
+        padding: 14px 24px;
+        margin: 0 24px;
     }
 
     &-submit {
         text-align: center;
-        margin-top: .48rem;
+        margin-top: 24px;
 
         .van-button {
             display: inline-block;
@@ -74,7 +74,7 @@
     }
 
     &-footer {
-        padding: .36rem;
+        padding: 18px;
         margin-top: auto;
 
         &__trem {
@@ -82,18 +82,18 @@
             justify-content: center;
             align-items: center;
             flex-wrap: wrap;
-            font-size: .24rem;
+            font-size: 12px;
 
             .van-checkbox {
-                margin-right: .12rem;
+                margin-right: 6px;
             }
         }
 
         &__version {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
             text-align: center;
-            margin-top: .08rem;
+            margin-top: 4px;
         }
     }
 }

src/packages/tc/assets/themes/default/default.less

@@ -16,7 +16,7 @@
     --color-down: #04c786;
 
     /* 导航栏 */
-    --navbar-height: .88rem;
+    --navbar-height: 44px;
     --navbar-color: #fff;
     --navbar-background: #C30D23;
     --navbar-backbutton-color: #fff;
@@ -27,7 +27,7 @@
     --tabbar-icon-active: #c30d23;
 
     /* 内容边距 */
-    --content-inset: .24rem;
+    --content-inset: 12px;
 
     /* Vant-Button */
     --van-button-border-width: 0;
@@ -52,12 +52,12 @@
                 align-items: center;
                 color: #626675;
                 cursor: pointer;
-                border-radius: .04rem;
+                border-radius: 2px;
                 background-color: #f0f0f1;
-                padding: .08rem .16rem;
+                padding: 4px 8px;
 
                 &:not(:first-child) {
-                    margin-left: .1rem;
+                    margin-left: 5px;
                 }
 
                 &.is-active {

src/packages/tc/assets/themes/global/global.less

@@ -51,16 +51,16 @@
     &__container {
         display: flex;
         flex-direction: column;
-        padding-bottom: .32rem;
+        padding-bottom: 16px;
 
         /* 父元素的第一个子元素 */
         .van-cell-group--inset:first-of-type {
-            margin-top: .32rem;
+            margin-top: 16px;
         }
 
         /* 相邻兄弟元素 */
         .van-cell-group--inset+.van-cell-group--inset {
-            margin-top: .24rem;
+            margin-top: 12px;
         }
 
         .van-field {
@@ -85,8 +85,8 @@
         }
 
         &.inset {
-            gap: .2rem;
-            padding: .2rem .32rem;
+            gap: 10px;
+            padding: 10px 16px;
         }
     }
 }
@@ -132,33 +132,33 @@
 .g-navmenu {
     .app-iconfont {
         .g-icon {
-            width: .36rem;
-            height: .36rem;
-            font-size: .36rem;
+            width: 18px;
+            height: 18px;
+            font-size: 18px;
         }
 
         &__label {
-            margin-left: .24rem;
+            margin-left: 12px;
         }
     }
 }
 
 /* 商品列表 */
 .g-goods-list {
-    padding: .2rem;
+    padding: 10px;
 
     .list {
-        padding: .2rem .2rem 0 .2rem;
+        padding: 10px 10px 0 10px;
 
         &-item {
             display: flex;
             align-items: center;
-            border-radius: .1rem;
+            border-radius: 5px;
             overflow: hidden;
-            padding: .2rem;
+            padding: 10px;
 
             &:not(:last-child) {
-                margin-bottom: .2rem;
+                margin-bottom: 10px;
             }
 
             .img {
@@ -167,18 +167,18 @@
                     align-items: center;
 
                     img {
-                        width: 1.8rem;
-                        height: 1.8rem;
+                        width: 90px;
+                        height: 90px;
                         object-fit: cover;
-                        border-radius: .16rem;
-                        margin-right: .3rem;
+                        border-radius: 8px;
+                        margin-right: 15px;
                     }
                 }
 
                 &:last-child {
                     .van-button {
-                        width: 1.3rem;
-                        height: .5rem;
+                        width: 65px;
+                        height: 25px;
                     }
                 }
             }
@@ -188,20 +188,20 @@
 
                 .title {
                     color: #333;
-                    font-size: .30rem;
+                    font-size: 15px;
                 }
 
                 .desc {
                     color: #666;
-                    font-size: .24rem;
-                    padding: .1rem 0;
+                    font-size: 12px;
+                    padding: 5px 0;
                 }
 
                 .price {
 
                     .buyprice,
                     .sellprice {
-                        padding-bottom: .02rem;
+                        padding-bottom: 1px;
                     }
                 }
             }
@@ -210,44 +210,44 @@
 }
 
 .g-goods-waterfall {
-    padding: .2rem;
+    padding: 10px;
 
     .goods {
         background-color: #fff;
-        border-radius: .12rem;
+        border-radius: 6px;
         overflow: hidden;
 
         &-image {
             display: flex;
             justify-content: center;
             align-items: center;
-            min-height: 2.4rem;
+            min-height: 120px;
             font-size: 0;
         }
 
         &-info {
-            padding: .2rem;
+            padding: 10px;
 
             &__title {
-                font-size: .26rem;
-                margin-bottom: .1rem;
+                font-size: 13px;
+                margin-bottom: 5px;
             }
 
             &__desc {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
-                margin-bottom: .1rem;
+                margin-bottom: 5px;
             }
 
             &__price {
                 color: #f2270c;
 
                 .unit {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .integer {
-                    font-size: .3rem;
+                    font-size: 15px;
                 }
             }
         }
@@ -256,24 +256,24 @@
 
 /* 订单列表 */
 .g-order-list {
-    padding: .2rem;
+    padding: 10px;
     padding-bottom: 0;
 
     &__box {
         &:not(:first-child) {
-            margin-top: .2rem;
+            margin-top: 10px;
         }
 
         background-color: #fff;
-        border-radius: .16rem;
-        padding: .24rem;
+        border-radius: 8px;
+        padding: 12px;
 
     }
 
     &__titlebar {
         display: flex;
         justify-content: space-between;
-        margin-bottom: .2rem;
+        margin-bottom: 10px;
 
         .left {
             h4 {
@@ -281,19 +281,19 @@
             }
 
             span {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
             }
         }
 
         .right {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
         }
     }
 
     &__content {
-        font-size: .24rem;
+        font-size: 12px;
 
         ul {
             display: flex;
@@ -303,14 +303,14 @@
             li {
                 display: flex;
                 justify-content: space-between;
-                line-height: .4rem;
-                width: calc(~"50% - .24rem");
+                line-height: 20px;
+                width: calc(~"50% - 12px");
 
                 span {
                     &:first-child {
                         color: #999;
                         white-space: nowrap;
-                        padding-right: .24rem;
+                        padding-right: 12px;
                     }
                 }
             }
@@ -320,11 +320,11 @@
     &__btnbar {
         display: flex;
         justify-content: flex-end;
-        gap: .16rem;
-        margin-top: .2rem;
+        gap: 8px;
+        margin-top: 10px;
 
         .van-button {
-            width: 1.6rem;
+            width: 80px;
             border-width: 1px;
         }
     }
@@ -340,30 +340,30 @@
             align-items: center;
             color: #fff;
             background-image: linear-gradient(to right, #ee0a24, #ff6034);
-            padding: .2rem .24rem;
+            padding: 10px 12px;
 
             &-left {
                 .price-text {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .price-integer {
-                    font-size: .44rem;
+                    font-size: 22px;
                 }
             }
 
             &-right {
                 display: flex;
                 flex-direction: column;
-                font-size: .24rem;
+                font-size: 12px;
             }
         }
 
         .title {
-            font-size: .3rem;
+            font-size: 15px;
             font-weight: bold;
-            line-height: .48rem;
-            padding: .24rem;
+            line-height: 24px;
+            padding: 12px;
             padding-bottom: 0;
 
             .van-tag {
@@ -371,34 +371,34 @@
             }
 
             span {
-                margin-right: .1rem;
+                margin-right: 5px;
             }
         }
 
         .desc {
-            padding: 0 .24rem;
+            padding: 0 12px;
         }
 
         .qty {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
-            padding: .1rem .24rem 0 .24rem;
+            padding: 5px 12px 0 12px;
         }
 
         .info {
             background-color: #fff;
-            padding: .2rem;
+            padding: 10px;
 
             ul {
                 display: flex;
                 flex-wrap: wrap;
-                font-size: .26rem;
+                font-size: 13px;
 
                 li {
                     display: flex;
                     justify-content: space-between;
                     width: 50%;
-                    padding: .08rem .24rem;
+                    padding: 4px 12px;
 
                     span {
                         &:first-child {
@@ -412,22 +412,22 @@
 
     &__desc {
         background-color: #fff;
-        margin-top: .24rem;
+        margin-top: 12px;
     }
 
     &__footer {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        height: .88rem;
+        height: 44px;
         background-color: #fff;
 
         .price {
-            padding-left: .32rem;
+            padding-left: 16px;
 
             &-text,
             &-unit {
-                font-size: .24rem;
+                font-size: 12px;
             }
 
             &-unit {
@@ -435,7 +435,7 @@
             }
 
             &-integer {
-                font-size: .32rem;
+                font-size: 16px;
                 color: #f2270c;
             }
         }
@@ -450,10 +450,10 @@
                 justify-content: center;
                 align-items: center;
                 height: 100%;
-                min-width: 2rem;
+                min-width: 100px;
                 font-weight: bold;
                 color: #fff;
-                padding: 0 .48rem;
+                padding: 0 24px;
 
                 &.warning {
                     background-image: linear-gradient(to right, #ffd01e, #ff8917);
@@ -478,7 +478,7 @@
     &__stepper {
         display: flex;
         align-items: center;
-        gap: .1rem;
+        gap: 5px;
         width: 100%;
 
         .van-stepper {
@@ -495,12 +495,12 @@
         display: flex;
         flex-wrap: wrap;
         width: 100%;
-        margin-top: .2rem;
+        margin-top: 10px;
     }
 
     .van-radio {
         width: calc(~'100% / 3');
-        padding: .04rem;
+        padding: 2px;
         margin-right: 0;
 
         .van-radio__icon {
@@ -510,12 +510,12 @@
         &__label {
             display: block;
             width: 100%;
-            font-size: .24rem;
+            font-size: 12px;
             text-align: center;
             color: #666;
             border: 1px solid #e5e5e5;
-            border-radius: .08rem;
-            padding: .04rem;
+            border-radius: 4px;
+            padding: 2px;
             margin-left: 0;
         }
 
@@ -531,8 +531,8 @@
 .van {
     &-dialog {
         &__message {
-            font-size: .28rem;
-            line-height: .44rem;
+            font-size: 14px;
+            line-height: 22px;
         }
     }
 

src/packages/tc/postcss.config.js

@@ -1,9 +1,10 @@
 module.exports = {
     plugins: {
-        // 'postcss-px-to-viewport': {
-        //     viewportWidth: 375,
-        //     landscape: true,
-        //     landscapeWidth: 980,
-        // },
+        'postcss-px-to-viewport': {
+            viewportWidth: 375,
+            landscape: true, // 是否处理横屏情况
+            landscapeUnit: 'vw', // 横屏时使用的单位
+            landscapeWidth: 844, // 横屏时使用的视口宽度
+        },
     },
 }

src/packages/tc/views/mine/index.less

@@ -1,7 +1,7 @@
 @import '@mobile/assets/themes/base/mixin.less';
 
 .mine {
-    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 3rem, transparent 3rem);
+    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 150px, transparent 150px);
 
     .app-navbar {
         background-image: @backgroundImage;
@@ -16,13 +16,13 @@
         color: #000;
         background-color: #fff;
         background-image: @backgroundImage;
-        padding: 0 .36rem;
+        padding: 0 18px;
 
         &__wrapper {
             background-color: #fff;
-            border-top-left-radius: .2rem;
-            border-top-right-radius: .2rem;
-            padding: .24rem;
+            border-top-left-radius: 10px;
+            border-top-right-radius: 10px;
+            padding: 12px;
         }
 
         .profile {
@@ -34,21 +34,21 @@
                 align-items: center;
 
                 .g-image--avatar {
-                    width: .8rem;
-                    height: .8rem;
+                    width: 40px;
+                    height: 40px;
                     border-radius: 50%;
                     font-size: 0;
-                    margin-right: .16rem;
+                    margin-right: 8px;
                 }
 
                 &__info {
                     flex: 1;
-                    padding-right: .32rem;
+                    padding-right: 16px;
 
                     .top {
                         display: flex;
                         align-items: center;
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #A1B1C5;
 
                         span {
@@ -57,13 +57,13 @@
 
                         .van-icon {
                             line-height: normal;
-                            margin-left: .04rem;
+                            margin-left: 2px;
                         }
                     }
 
                     .bottom {
-                        line-height: .4rem;
-                        font-size: .3rem;
+                        line-height: 20px;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -75,21 +75,21 @@
                 justify-content: center;
 
                 span {
-                    line-height: .4rem;
+                    line-height: 20px;
 
                     &:first-child {
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #46D63C;
 
                         &::before {
                             content: '资金账户';
                             color: #A1B1C5;
-                            margin-right: .12rem;
+                            margin-right: 6px;
                         }
                     }
 
                     &:last-child {
-                        font-size: .3rem;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -99,24 +99,24 @@
         .bank {
             display: flex;
             justify-content: space-around;
-            padding: .36rem 0;
+            padding: 18px 0;
 
             ul {
                 li {
                     display: flex;
                     flex-direction: column;
-                    padding-bottom: .1rem;
+                    padding-bottom: 5px;
 
                     span {
-                        line-height: .4rem;
+                        line-height: 20px;
 
                         &:first-child {
-                            font-size: .24rem;
+                            font-size: 12px;
                             color: #A1B1C5;
                         }
 
                         &:last-child {
-                            font-size: .3rem;
+                            font-size: 15px;
                             font-weight: bold;
                         }
                     }
@@ -129,8 +129,8 @@
             justify-content: space-around;
 
             .van-button {
-                width: 2.8rem;
-                box-shadow: 0 .06rem .14rem 0 #e0e2e8;
+                width: 140px;
+                box-shadow: 0 3px 7px 0 #e0e2e8;
             }
         }
     }
@@ -139,7 +139,7 @@
         ul {
             display: flex;
             background-color: #fff;
-            padding: .24rem;
+            padding: 12px;
 
             li {
                 flex: 1;
@@ -148,8 +148,8 @@
                 align-items: center;
 
                 .g-icon {
-                    font-size: .56rem;
-                    margin-bottom: .04rem;
+                    font-size: 28px;
+                    margin-bottom: 2px;
                 }
             }
         }
@@ -157,7 +157,7 @@
 
     &-footer {
         text-align: center;
-        padding: .2rem 0;
+        padding: 10px 0;
 
         .button-logout {
             width: 50%;

src/packages/tjmd/assets/themes/default/default.less

@@ -16,7 +16,7 @@
     --color-down: #04c786;
 
     /* 导航栏 */
-    --navbar-height: .88rem;
+    --navbar-height: 44px;
     --navbar-color: #fff;
     --navbar-background: #C30D23;
     --navbar-backbutton-color: #fff;
@@ -27,7 +27,7 @@
     --tabbar-icon-active: #c30d23;
 
     /* 内容边距 */
-    --content-inset: .24rem;
+    --content-inset: 12px;
 
     /* Vant-Button */
     --van-button-border-width: 0;
@@ -52,12 +52,12 @@
                 align-items: center;
                 color: #626675;
                 cursor: pointer;
-                border-radius: .04rem;
+                border-radius: 2px;
                 background-color: #f0f0f1;
-                padding: .08rem .16rem;
+                padding: 4px 8px;
 
                 &:not(:first-child) {
-                    margin-left: .1rem;
+                    margin-left: 5px;
                 }
 
                 &.is-active {

src/packages/tjmd/assets/themes/global/global.less

@@ -51,16 +51,16 @@
     &__container {
         display: flex;
         flex-direction: column;
-        padding-bottom: .32rem;
+        padding-bottom: 16px;
 
         /* 父元素的第一个子元素 */
         .van-cell-group--inset:first-of-type {
-            margin-top: .32rem;
+            margin-top: 16px;
         }
 
         /* 相邻兄弟元素 */
         .van-cell-group--inset+.van-cell-group--inset {
-            margin-top: .24rem;
+            margin-top: 12px;
         }
 
         .van-field {
@@ -85,8 +85,8 @@
         }
 
         &.inset {
-            gap: .2rem;
-            padding: .2rem .32rem;
+            gap: 10px;
+            padding: 10px 16px;
         }
     }
 }
@@ -132,33 +132,33 @@
 .g-navmenu {
     .app-iconfont {
         .g-icon {
-            width: .36rem;
-            height: .36rem;
-            font-size: .36rem;
+            width: 18px;
+            height: 18px;
+            font-size: 18px;
         }
 
         &__label {
-            margin-left: .24rem;
+            margin-left: 12px;
         }
     }
 }
 
 /* 商品列表 */
 .g-goods-list {
-    padding: .2rem;
+    padding: 10px;
 
     .list {
-        padding: .2rem .2rem 0 .2rem;
+        padding: 10px 10px 0 10px;
 
         &-item {
             display: flex;
             align-items: center;
-            border-radius: .1rem;
+            border-radius: 5px;
             overflow: hidden;
-            padding: .2rem;
+            padding: 10px;
 
             &:not(:last-child) {
-                margin-bottom: .2rem;
+                margin-bottom: 10px;
             }
 
             .img {
@@ -167,18 +167,18 @@
                     align-items: center;
 
                     img {
-                        width: 1.8rem;
-                        height: 1.8rem;
+                        width: 90px;
+                        height: 90px;
                         object-fit: cover;
-                        border-radius: .16rem;
-                        margin-right: .3rem;
+                        border-radius: 8px;
+                        margin-right: 15px;
                     }
                 }
 
                 &:last-child {
                     .van-button {
-                        width: 1.3rem;
-                        height: .5rem;
+                        width: 65px;
+                        height: 25px;
                     }
                 }
             }
@@ -188,20 +188,20 @@
 
                 .title {
                     color: #333;
-                    font-size: .30rem;
+                    font-size: 15px;
                 }
 
                 .desc {
                     color: #666;
-                    font-size: .24rem;
-                    padding: .1rem 0;
+                    font-size: 12px;
+                    padding: 5px 0;
                 }
 
                 .price {
 
                     .buyprice,
                     .sellprice {
-                        padding-bottom: .02rem;
+                        padding-bottom: 1px;
                     }
                 }
             }
@@ -210,44 +210,44 @@
 }
 
 .g-goods-waterfall {
-    padding: .2rem;
+    padding: 10px;
 
     .goods {
         background-color: #fff;
-        border-radius: .12rem;
+        border-radius: 6px;
         overflow: hidden;
 
         &-image {
             display: flex;
             justify-content: center;
             align-items: center;
-            min-height: 2.4rem;
+            min-height: 120px;
             font-size: 0;
         }
 
         &-info {
-            padding: .2rem;
+            padding: 10px;
 
             &__title {
-                font-size: .26rem;
-                margin-bottom: .1rem;
+                font-size: 13px;
+                margin-bottom: 5px;
             }
 
             &__desc {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
-                margin-bottom: .1rem;
+                margin-bottom: 5px;
             }
 
             &__price {
                 color: #f2270c;
 
                 .unit {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .integer {
-                    font-size: .3rem;
+                    font-size: 15px;
                 }
             }
         }
@@ -256,24 +256,24 @@
 
 /* 订单列表 */
 .g-order-list {
-    padding: .2rem;
+    padding: 10px;
     padding-bottom: 0;
 
     &__box {
         &:not(:first-child) {
-            margin-top: .2rem;
+            margin-top: 10px;
         }
 
         background-color: #fff;
-        border-radius: .16rem;
-        padding: .24rem;
+        border-radius: 8px;
+        padding: 12px;
 
     }
 
     &__titlebar {
         display: flex;
         justify-content: space-between;
-        margin-bottom: .2rem;
+        margin-bottom: 10px;
 
         .left {
             h4 {
@@ -281,19 +281,19 @@
             }
 
             span {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
             }
         }
 
         .right {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
         }
     }
 
     &__content {
-        font-size: .24rem;
+        font-size: 12px;
 
         ul {
             display: flex;
@@ -303,14 +303,14 @@
             li {
                 display: flex;
                 justify-content: space-between;
-                line-height: .4rem;
-                width: calc(~"50% - .24rem");
+                line-height: 20px;
+                width: calc(~"50% - 12px");
 
                 span {
                     &:first-child {
                         color: #999;
                         white-space: nowrap;
-                        padding-right: .24rem;
+                        padding-right: 12px;
                     }
                 }
             }
@@ -320,11 +320,11 @@
     &__btnbar {
         display: flex;
         justify-content: flex-end;
-        gap: .16rem;
-        margin-top: .2rem;
+        gap: 8px;
+        margin-top: 10px;
 
         .van-button {
-            width: 1.6rem;
+            width: 80px;
             border-width: 1px;
         }
     }
@@ -340,30 +340,30 @@
             align-items: center;
             color: #fff;
             background-image: linear-gradient(to right, #ee0a24, #ff6034);
-            padding: .2rem .24rem;
+            padding: 10px 12px;
 
             &-left {
                 .price-text {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .price-integer {
-                    font-size: .44rem;
+                    font-size: 22px;
                 }
             }
 
             &-right {
                 display: flex;
                 flex-direction: column;
-                font-size: .24rem;
+                font-size: 12px;
             }
         }
 
         .title {
-            font-size: .3rem;
+            font-size: 15px;
             font-weight: bold;
-            line-height: .48rem;
-            padding: .24rem;
+            line-height: 24px;
+            padding: 12px;
             padding-bottom: 0;
 
             .van-tag {
@@ -371,34 +371,34 @@
             }
 
             span {
-                margin-right: .1rem;
+                margin-right: 5px;
             }
         }
 
         .desc {
-            padding: 0 .24rem;
+            padding: 0 12px;
         }
 
         .qty {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
-            padding: .1rem .24rem 0 .24rem;
+            padding: 5px 12px 0 12px;
         }
 
         .info {
             background-color: #fff;
-            padding: .2rem;
+            padding: 10px;
 
             ul {
                 display: flex;
                 flex-wrap: wrap;
-                font-size: .26rem;
+                font-size: 13px;
 
                 li {
                     display: flex;
                     justify-content: space-between;
                     width: 50%;
-                    padding: .08rem .24rem;
+                    padding: 4px 12px;
 
                     span {
                         &:first-child {
@@ -412,22 +412,22 @@
 
     &__desc {
         background-color: #fff;
-        margin-top: .24rem;
+        margin-top: 12px;
     }
 
     &__footer {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        height: .88rem;
+        height: 44px;
         background-color: #fff;
 
         .price {
-            padding-left: .32rem;
+            padding-left: 16px;
 
             &-text,
             &-unit {
-                font-size: .24rem;
+                font-size: 12px;
             }
 
             &-unit {
@@ -435,7 +435,7 @@
             }
 
             &-integer {
-                font-size: .32rem;
+                font-size: 16px;
                 color: #f2270c;
             }
         }
@@ -450,10 +450,10 @@
                 justify-content: center;
                 align-items: center;
                 height: 100%;
-                min-width: 2rem;
+                min-width: 100px;
                 font-weight: bold;
                 color: #fff;
-                padding: 0 .48rem;
+                padding: 0 24px;
 
                 &.warning {
                     background-image: linear-gradient(to right, #ffd01e, #ff8917);
@@ -478,7 +478,7 @@
     &__stepper {
         display: flex;
         align-items: center;
-        gap: .1rem;
+        gap: 5px;
         width: 100%;
 
         .van-stepper {
@@ -495,12 +495,12 @@
         display: flex;
         flex-wrap: wrap;
         width: 100%;
-        margin-top: .2rem;
+        margin-top: 10px;
     }
 
     .van-radio {
         width: calc(~'100% / 3');
-        padding: .04rem;
+        padding: 2px;
         margin-right: 0;
 
         .van-radio__icon {
@@ -510,12 +510,12 @@
         &__label {
             display: block;
             width: 100%;
-            font-size: .24rem;
+            font-size: 12px;
             text-align: center;
             color: #666;
             border: 1px solid #e5e5e5;
-            border-radius: .08rem;
-            padding: .04rem;
+            border-radius: 4px;
+            padding: 2px;
             margin-left: 0;
         }
 
@@ -531,8 +531,8 @@
 .van {
     &-dialog {
         &__message {
-            font-size: .28rem;
-            line-height: .44rem;
+            font-size: 14px;
+            line-height: 22px;
         }
     }
 

src/packages/tjmd/postcss.config.js

@@ -1,9 +1,10 @@
 module.exports = {
     plugins: {
-        // 'postcss-px-to-viewport': {
-        //     viewportWidth: 375,
-        //     landscape: true,
-        //     landscapeWidth: 980,
-        // },
+        'postcss-px-to-viewport': {
+            viewportWidth: 375,
+            landscape: true, // 是否处理横屏情况
+            landscapeUnit: 'vw', // 横屏时使用的单位
+            landscapeWidth: 844, // 横屏时使用的视口宽度
+        },
     },
 }

src/packages/tjmd/views/home/main/index.less

@@ -3,17 +3,17 @@
 .home-main {
     &__header {
         background: linear-gradient(var(--navbar-background), var(--navbar-background) 60%, transparent 60%);
-        padding: .2rem;
+        padding: 10px;
     }
 
     &__iconbar {
         ul {
             display: flex;
             flex-wrap: wrap;
-            padding-top: .24rem;
+            padding-top: 12px;
 
             &:last-child {
-                padding-bottom: .24rem;
+                padding-bottom: 12px;
             }
 
             li {
@@ -25,12 +25,12 @@
 
                 .app-iconfont {
                     &__icon {
-                        font-size: .8rem;
+                        font-size: 40px;
                     }
 
                     &__label {
-                        font-size: .24rem;
-                        margin-top: .1rem;
+                        font-size: 12px;
+                        margin-top: 5px;
                     }
                 }
             }
@@ -39,7 +39,7 @@
 
     &__titlebar {
         .van-cell__title {
-            font-size: .32rem;
+            font-size: 16px;
             font-weight: bold;
         }
 
@@ -52,7 +52,7 @@
     &__market {
         .scrollbar {
             width: 100%;
-            padding: .2rem;
+            padding: 10px;
         }
 
         .van-swipe {
@@ -64,7 +64,7 @@
                 justify-content: space-around;
                 align-items: center;
                 height: inherit;
-                font-size: .26rem;
+                font-size: 13px;
             }
         }
     }
@@ -80,8 +80,8 @@
 
                 .van-cell__value {
                     flex: initial;
-                    font-size: .24rem;
-                    margin-left: .48rem;
+                    font-size: 12px;
+                    margin-left: 24px;
                 }
             }
         }
@@ -92,11 +92,11 @@
             display: flex;
             text-align: center;
             color: #777;
-            line-height: .44rem;
+            line-height: 22px;
 
             li {
                 flex: 1;
-                padding: .12rem 0;
+                padding: 6px 0;
 
                 &.is-active {
                     &::before {
@@ -113,10 +113,10 @@
                 }
 
                 span {
-                    font-size: .24rem;
+                    font-size: 12px;
 
                     +span {
-                        margin-left: .1rem;
+                        margin-left: 5px;
                     }
                 }
             }

src/packages/tjmd/views/mine/index.less

@@ -1,7 +1,7 @@
 @import '@mobile/assets/themes/base/mixin.less';
 
 .mine {
-    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 3rem, transparent 3rem);
+    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 150px, transparent 150px);
 
     .app-navbar {
         background-image: @backgroundImage;
@@ -16,13 +16,13 @@
         color: #000;
         background-color: #fff;
         background-image: @backgroundImage;
-        padding: 0 .36rem;
+        padding: 0 18px;
 
         &__wrapper {
             background-color: #fff;
-            border-top-left-radius: .2rem;
-            border-top-right-radius: .2rem;
-            padding: .24rem;
+            border-top-left-radius: 10px;
+            border-top-right-radius: 10px;
+            padding: 12px;
         }
 
         .profile {
@@ -34,21 +34,21 @@
                 align-items: center;
 
                 .g-image--avatar {
-                    width: .8rem;
-                    height: .8rem;
+                    width: 40px;
+                    height: 40px;
                     border-radius: 50%;
                     font-size: 0;
-                    margin-right: .16rem;
+                    margin-right: 8px;
                 }
 
                 &__info {
                     flex: 1;
-                    padding-right: .32rem;
+                    padding-right: 16px;
 
                     .top {
                         display: flex;
                         align-items: center;
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #A1B1C5;
 
                         span {
@@ -57,13 +57,13 @@
 
                         .van-icon {
                             line-height: normal;
-                            margin-left: .04rem;
+                            margin-left: 2px;
                         }
                     }
 
                     .bottom {
-                        line-height: .4rem;
-                        font-size: .3rem;
+                        line-height: 20px;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -75,21 +75,21 @@
                 justify-content: center;
 
                 span {
-                    line-height: .4rem;
+                    line-height: 20px;
 
                     &:first-child {
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #46D63C;
 
                         &::before {
                             content: '资金账户';
                             color: #A1B1C5;
-                            margin-right: .12rem;
+                            margin-right: 6px;
                         }
                     }
 
                     &:last-child {
-                        font-size: .3rem;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -99,24 +99,24 @@
         .bank {
             display: flex;
             justify-content: space-around;
-            padding: .36rem 0;
+            padding: 18px 0;
 
             ul {
                 li {
                     display: flex;
                     flex-direction: column;
-                    padding-bottom: .1rem;
+                    padding-bottom: 5px;
 
                     span {
-                        line-height: .4rem;
+                        line-height: 20px;
 
                         &:first-child {
-                            font-size: .24rem;
+                            font-size: 12px;
                             color: #A1B1C5;
                         }
 
                         &:last-child {
-                            font-size: .3rem;
+                            font-size: 15px;
                             font-weight: bold;
                         }
                     }
@@ -129,8 +129,8 @@
             justify-content: space-around;
 
             .van-button {
-                width: 2.8rem;
-                box-shadow: 0 .06rem .14rem 0 #e0e2e8;
+                width: 140px;
+                box-shadow: 0 3px 7px 0 #e0e2e8;
             }
         }
     }
@@ -139,7 +139,7 @@
         ul {
             display: flex;
             background-color: #fff;
-            padding: .24rem;
+            padding: 12px;
 
             li {
                 flex: 1;
@@ -148,8 +148,8 @@
                 align-items: center;
 
                 .g-icon {
-                    font-size: .56rem;
-                    margin-bottom: .04rem;
+                    font-size: 28px;
+                    margin-bottom: 2px;
                 }
             }
         }
@@ -157,7 +157,7 @@
 
     &-footer {
         text-align: center;
-        padding: .2rem 0;
+        padding: 10px 0;
 
         .button-logout {
             width: 50%;

src/packages/tjmd/views/user/login/index.less

@@ -3,7 +3,7 @@
 
     &-logo {
         img {
-            height: 1.6rem;
+            height: 80px;
         }
     }
 }

src/packages/zrwyt/assets/themes/default/default.less

@@ -16,7 +16,7 @@
     --color-down: #04c786;
 
     /* 导航栏 */
-    --navbar-height: .88rem;
+    --navbar-height: 44px;
     --navbar-color: #fff;
     --navbar-background: #C30D23;
     --navbar-backbutton-color: #fff;
@@ -27,7 +27,7 @@
     --tabbar-icon-active: #c30d23;
 
     /* 内容边距 */
-    --content-inset: .24rem;
+    --content-inset: 12px;
 
     /* Vant-Button */
     --van-button-border-width: 0;
@@ -52,12 +52,12 @@
                 align-items: center;
                 color: #626675;
                 cursor: pointer;
-                border-radius: .04rem;
+                border-radius: 2px;
                 background-color: #f0f0f1;
-                padding: .08rem .16rem;
+                padding: 4px 8px;
 
                 &:not(:first-child) {
-                    margin-left: .1rem;
+                    margin-left: 5px;
                 }
 
                 &.is-active {

src/packages/zrwyt/assets/themes/global/global.less

@@ -51,16 +51,16 @@
     &__container {
         display: flex;
         flex-direction: column;
-        padding-bottom: .32rem;
+        padding-bottom: 16px;
 
         /* 父元素的第一个子元素 */
         .van-cell-group--inset:first-of-type {
-            margin-top: .32rem;
+            margin-top: 16px;
         }
 
         /* 相邻兄弟元素 */
         .van-cell-group--inset+.van-cell-group--inset {
-            margin-top: .24rem;
+            margin-top: 12px;
         }
 
         .van-field {
@@ -85,8 +85,8 @@
         }
 
         &.inset {
-            gap: .2rem;
-            padding: .2rem .32rem;
+            gap: 10px;
+            padding: 10px 16px;
         }
     }
 }
@@ -132,33 +132,33 @@
 .g-navmenu {
     .app-iconfont {
         .g-icon {
-            width: .36rem;
-            height: .36rem;
-            font-size: .36rem;
+            width: 18px;
+            height: 18px;
+            font-size: 18px;
         }
 
         &__label {
-            margin-left: .24rem;
+            margin-left: 12px;
         }
     }
 }
 
 /* 商品列表 */
 .g-goods-list {
-    padding: .2rem;
+    padding: 10px;
 
     .list {
-        padding: .2rem .2rem 0 .2rem;
+        padding: 10px 10px 0 10px;
 
         &-item {
             display: flex;
             align-items: center;
-            border-radius: .1rem;
+            border-radius: 5px;
             overflow: hidden;
-            padding: .2rem;
+            padding: 10px;
 
             &:not(:last-child) {
-                margin-bottom: .2rem;
+                margin-bottom: 10px;
             }
 
             .img {
@@ -167,18 +167,18 @@
                     align-items: center;
 
                     img {
-                        width: 1.8rem;
-                        height: 1.8rem;
+                        width: 90px;
+                        height: 90px;
                         object-fit: cover;
-                        border-radius: .16rem;
-                        margin-right: .3rem;
+                        border-radius: 8px;
+                        margin-right: 15px;
                     }
                 }
 
                 &:last-child {
                     .van-button {
-                        width: 1.3rem;
-                        height: .5rem;
+                        width: 65px;
+                        height: 25px;
                     }
                 }
             }
@@ -188,20 +188,20 @@
 
                 .title {
                     color: #333;
-                    font-size: .30rem;
+                    font-size: 15px;
                 }
 
                 .desc {
                     color: #666;
-                    font-size: .24rem;
-                    padding: .1rem 0;
+                    font-size: 12px;
+                    padding: 5px 0;
                 }
 
                 .price {
 
                     .buyprice,
                     .sellprice {
-                        padding-bottom: .02rem;
+                        padding-bottom: 1px;
                     }
                 }
             }
@@ -210,44 +210,44 @@
 }
 
 .g-goods-waterfall {
-    padding: .2rem;
+    padding: 10px;
 
     .goods {
         background-color: #fff;
-        border-radius: .12rem;
+        border-radius: 6px;
         overflow: hidden;
 
         &-image {
             display: flex;
             justify-content: center;
             align-items: center;
-            min-height: 2.4rem;
+            min-height: 120px;
             font-size: 0;
         }
 
         &-info {
-            padding: .2rem;
+            padding: 10px;
 
             &__title {
-                font-size: .26rem;
-                margin-bottom: .1rem;
+                font-size: 13px;
+                margin-bottom: 5px;
             }
 
             &__desc {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
-                margin-bottom: .1rem;
+                margin-bottom: 5px;
             }
 
             &__price {
                 color: #f2270c;
 
                 .unit {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .integer {
-                    font-size: .3rem;
+                    font-size: 15px;
                 }
             }
         }
@@ -256,24 +256,24 @@
 
 /* 订单列表 */
 .g-order-list {
-    padding: .2rem;
+    padding: 10px;
     padding-bottom: 0;
 
     &__box {
         &:not(:first-child) {
-            margin-top: .2rem;
+            margin-top: 10px;
         }
 
         background-color: #fff;
-        border-radius: .16rem;
-        padding: .24rem;
+        border-radius: 8px;
+        padding: 12px;
 
     }
 
     &__titlebar {
         display: flex;
         justify-content: space-between;
-        margin-bottom: .2rem;
+        margin-bottom: 10px;
 
         .left {
             h4 {
@@ -281,19 +281,19 @@
             }
 
             span {
-                font-size: .24rem;
+                font-size: 12px;
                 color: #999;
             }
         }
 
         .right {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
         }
     }
 
     &__content {
-        font-size: .24rem;
+        font-size: 12px;
 
         ul {
             display: flex;
@@ -303,14 +303,14 @@
             li {
                 display: flex;
                 justify-content: space-between;
-                line-height: .4rem;
-                width: calc(~"50% - .24rem");
+                line-height: 20px;
+                width: calc(~"50% - 12px");
 
                 span {
                     &:first-child {
                         color: #999;
                         white-space: nowrap;
-                        padding-right: .24rem;
+                        padding-right: 12px;
                     }
                 }
             }
@@ -320,11 +320,11 @@
     &__btnbar {
         display: flex;
         justify-content: flex-end;
-        gap: .16rem;
-        margin-top: .2rem;
+        gap: 8px;
+        margin-top: 10px;
 
         .van-button {
-            width: 1.6rem;
+            width: 80px;
             border-width: 1px;
         }
     }
@@ -340,30 +340,30 @@
             align-items: center;
             color: #fff;
             background-image: linear-gradient(to right, #ee0a24, #ff6034);
-            padding: .2rem .24rem;
+            padding: 10px 12px;
 
             &-left {
                 .price-text {
-                    font-size: .24rem;
+                    font-size: 12px;
                 }
 
                 .price-integer {
-                    font-size: .44rem;
+                    font-size: 22px;
                 }
             }
 
             &-right {
                 display: flex;
                 flex-direction: column;
-                font-size: .24rem;
+                font-size: 12px;
             }
         }
 
         .title {
-            font-size: .3rem;
+            font-size: 15px;
             font-weight: bold;
-            line-height: .48rem;
-            padding: .24rem;
+            line-height: 24px;
+            padding: 12px;
             padding-bottom: 0;
 
             .van-tag {
@@ -371,34 +371,34 @@
             }
 
             span {
-                margin-right: .1rem;
+                margin-right: 5px;
             }
         }
 
         .desc {
-            padding: 0 .24rem;
+            padding: 0 12px;
         }
 
         .qty {
-            font-size: .24rem;
+            font-size: 12px;
             color: #999;
-            padding: .1rem .24rem 0 .24rem;
+            padding: 5px 12px 0 12px;
         }
 
         .info {
             background-color: #fff;
-            padding: .2rem;
+            padding: 10px;
 
             ul {
                 display: flex;
                 flex-wrap: wrap;
-                font-size: .26rem;
+                font-size: 13px;
 
                 li {
                     display: flex;
                     justify-content: space-between;
                     width: 50%;
-                    padding: .08rem .24rem;
+                    padding: 4px 12px;
 
                     span {
                         &:first-child {
@@ -412,22 +412,22 @@
 
     &__desc {
         background-color: #fff;
-        margin-top: .24rem;
+        margin-top: 12px;
     }
 
     &__footer {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        height: .88rem;
+        height: 44px;
         background-color: #fff;
 
         .price {
-            padding-left: .32rem;
+            padding-left: 16px;
 
             &-text,
             &-unit {
-                font-size: .24rem;
+                font-size: 12px;
             }
 
             &-unit {
@@ -435,7 +435,7 @@
             }
 
             &-integer {
-                font-size: .32rem;
+                font-size: 16px;
                 color: #f2270c;
             }
         }
@@ -450,10 +450,10 @@
                 justify-content: center;
                 align-items: center;
                 height: 100%;
-                min-width: 2rem;
+                min-width: 100px;
                 font-weight: bold;
                 color: #fff;
-                padding: 0 .48rem;
+                padding: 0 24px;
 
                 &.warning {
                     background-image: linear-gradient(to right, #ffd01e, #ff8917);
@@ -478,7 +478,7 @@
     &__stepper {
         display: flex;
         align-items: center;
-        gap: .1rem;
+        gap: 5px;
         width: 100%;
 
         .van-stepper {
@@ -495,12 +495,12 @@
         display: flex;
         flex-wrap: wrap;
         width: 100%;
-        margin-top: .2rem;
+        margin-top: 10px;
     }
 
     .van-radio {
         width: calc(~'100% / 3');
-        padding: .04rem;
+        padding: 2px;
         margin-right: 0;
 
         .van-radio__icon {
@@ -510,12 +510,12 @@
         &__label {
             display: block;
             width: 100%;
-            font-size: .24rem;
+            font-size: 12px;
             text-align: center;
             color: #666;
             border: 1px solid #e5e5e5;
-            border-radius: .08rem;
-            padding: .04rem;
+            border-radius: 4px;
+            padding: 2px;
             margin-left: 0;
         }
 
@@ -531,8 +531,8 @@
 .van {
     &-dialog {
         &__message {
-            font-size: .28rem;
-            line-height: .44rem;
+            font-size: 14px;
+            line-height: 22px;
         }
     }
 

src/packages/zrwyt/postcss.config.js

@@ -1,9 +1,10 @@
 module.exports = {
     plugins: {
-        // 'postcss-px-to-viewport': {
-        //     viewportWidth: 375,
-        //     landscape: true,
-        //     landscapeWidth: 980,
-        // },
+        'postcss-px-to-viewport': {
+            viewportWidth: 375,
+            landscape: true, // 是否处理横屏情况
+            landscapeUnit: 'vw', // 横屏时使用的单位
+            landscapeWidth: 844, // 横屏时使用的视口宽度
+        },
     },
 }

src/packages/zrwyt/views/mine/index.less

@@ -1,7 +1,7 @@
 @import '@mobile/assets/themes/base/mixin.less';
 
 .mine {
-    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 3rem, transparent 3rem);
+    @backgroundImage: linear-gradient(var(--navbar-background), var(--navbar-background) 150px, transparent 150px);
 
     .app-navbar {
         background-image: @backgroundImage;
@@ -16,13 +16,13 @@
         color: #000;
         background-color: #fff;
         background-image: @backgroundImage;
-        padding: 0 .36rem;
+        padding: 0 18px;
 
         &__wrapper {
             background-color: #fff;
-            border-top-left-radius: .2rem;
-            border-top-right-radius: .2rem;
-            padding: .24rem;
+            border-top-left-radius: 10px;
+            border-top-right-radius: 10px;
+            padding: 12px;
         }
 
         .profile {
@@ -34,21 +34,21 @@
                 align-items: center;
 
                 .g-image--avatar {
-                    width: .8rem;
-                    height: .8rem;
+                    width: 40px;
+                    height: 40px;
                     border-radius: 50%;
                     font-size: 0;
-                    margin-right: .16rem;
+                    margin-right: 8px;
                 }
 
                 &__info {
                     flex: 1;
-                    padding-right: .32rem;
+                    padding-right: 16px;
 
                     .top {
                         display: flex;
                         align-items: center;
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #A1B1C5;
 
                         span {
@@ -57,13 +57,13 @@
 
                         .van-icon {
                             line-height: normal;
-                            margin-left: .04rem;
+                            margin-left: 2px;
                         }
                     }
 
                     .bottom {
-                        line-height: .4rem;
-                        font-size: .3rem;
+                        line-height: 20px;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -75,21 +75,21 @@
                 justify-content: center;
 
                 span {
-                    line-height: .4rem;
+                    line-height: 20px;
 
                     &:first-child {
-                        font-size: .24rem;
+                        font-size: 12px;
                         color: #46D63C;
 
                         &::before {
                             content: '资金账户';
                             color: #A1B1C5;
-                            margin-right: .12rem;
+                            margin-right: 6px;
                         }
                     }
 
                     &:last-child {
-                        font-size: .3rem;
+                        font-size: 15px;
                         font-weight: bold;
                     }
                 }
@@ -99,24 +99,24 @@
         .bank {
             display: flex;
             justify-content: space-around;
-            padding: .36rem 0;
+            padding: 18px 0;
 
             ul {
                 li {
                     display: flex;
                     flex-direction: column;
-                    padding-bottom: .1rem;
+                    padding-bottom: 5px
 
                     span {
-                        line-height: .4rem;
+                        line-height: 20px;
 
                         &:first-child {
-                            font-size: .24rem;
+                            font-size: 12px;
                             color: #A1B1C5;
                         }
 
                         &:last-child {
-                            font-size: .3rem;
+                            font-size: 15px;
                             font-weight: bold;
                         }
                     }
@@ -129,8 +129,8 @@
             justify-content: space-around;
 
             .van-button {
-                width: 2.8rem;
-                box-shadow: 0 .06rem .14rem 0 #e0e2e8;
+                width: 140px;
+                box-shadow: 0 3px 7px 0 #e0e2e8;
             }
         }
     }
@@ -139,7 +139,7 @@
         ul {
             display: flex;
             background-color: #fff;
-            padding: .24rem;
+            padding: 12px;
 
             li {
                 flex: 1;
@@ -148,8 +148,8 @@
                 align-items: center;
 
                 .g-icon {
-                    font-size: .56rem;
-                    margin-bottom: .04rem;
+                    font-size: 28px;
+                    margin-bottom: 2px;
                 }
             }
         }
@@ -157,7 +157,7 @@
 
     &-footer {
         text-align: center;
-        padding: .2rem 0;
+        padding: 10px 0;
 
         .button-logout {
             width: 50%;