商品详情底部适配调试

src/views/shop-mall/goods-detail/index.module.less

@@ -159,11 +159,15 @@
 }
 
 .actionBar {
-  height: var(--van-submit-bar-height);
   padding: 0px 5px;
   justify-content: space-between;
   box-shadow: 0px -10px 10px var(--box-shadow-color);
+  box-sizing: border-box;
   :global {
+    .van-submit-bar__bar {
+      justify-content: space-between;
+      padding: 0;
+    }
     .van-action-bar-icon {
       align-items: center;
     }
@@ -171,16 +175,14 @@
       margin-bottom: 0;
       line-height: 0;
     }
-    .van-badge{
-      background: #FF4E19;
+    .van-badge {
+      background: #ff4e19;
     }
   }
 }
 
 .addCertBtn {
   background: #fff;
-  border: var(--van-button-border-width) solid
-    var(--van-button-primary-border-color) !important;
   color: var(--van-primary);
 }
 
@@ -188,4 +190,10 @@
   flex-basis: 60%;
   display: flex;
   justify-content: center;
+  border: var(--van-button-border-width) solid
+    var(--van-button-primary-border-color) !important;
+  border-radius: 20px;
+  background-color: var(--van-primary);
+  overflow: hidden;
+  box-sizing: border-box;
 }

src/views/shop-mall/goods-detail/index.tsx

@@ -91,7 +91,9 @@ export default defineComponent({
       )
       this.loading = false
       const result = res.data || {}
-      this.albumPics = [result.product.pic].concat(result.product.albumPics.split(',')).filter(n => n)
+      this.albumPics = [result.product.pic]
+        .concat(result.product.albumPics.split(','))
+        .filter(n => n)
       this.product = result.product
       this.skuStockListTemp = result.skuStockList || []
       if (this.skuStockListTemp.length) {
@@ -285,8 +287,7 @@ export default defineComponent({
 
         {!this.loading && (
           <>
-          
-            <ActionBar class={styles.actionBar}>
+            {/* <ActionBar class={styles.actionBar}>
               <ActionBarIcon
                 icon="cart-o"
                 // text="购物车"
@@ -314,8 +315,38 @@ export default defineComponent({
                   onClick={() => this.onShowCart('cartConfirm')}
                 />
               </div>
-            </ActionBar>
-            <SubmitBar style={{display: 'none'}}></SubmitBar>
+            </ActionBar> */}
+            <SubmitBar
+              class={styles.actionBar}
+              safe-area-inset-bottom
+              v-slots={{
+                button: () => (
+                  <div class={styles.buyGroup}>
+                    <ActionBarButton
+                      type="primary"
+                      class={styles.addCertBtn}
+                      text="加入购物车"
+                      onClick={() => this.onShowCart()}
+                    />
+                    <ActionBarButton
+                      type="primary"
+                      text="立即购买"
+                      onClick={() => this.onShowCart('cartConfirm')}
+                    />
+                  </div>
+                )
+              }}
+            >
+              <Badge
+                content={this.cartCount}
+                showZero={false}
+                onClick={() => {
+                  this.$router.push('/cart')
+                }}
+              >
+                <Icon name={iconShopCart} size={30} />
+              </Badge>
+            </SubmitBar>
           </>
         )}
         <Popup