商城优化

src/components/col-search/index.module.less

@@ -39,7 +39,10 @@
   }
 
   .searchBtn {
-    padding: 0 14px;
+    width: 56px;
+    height: 28px;
+    padding: 0;
+    font-size: 14px;
     --van-button-mini-height: 28px;
     --van-font-size-xs: 14px;
   }

src/views/shop-mall/components/hot-goods/index.module.less

@@ -1,7 +1,6 @@
 .hotGoods {
   margin: 0 14px 10px;
-  height: 150px;
-  background: linear-gradient(180deg, #ffecba 0%, rgba(255, 255, 255, 0) 100%);
+  background: linear-gradient(180deg, #FFE4A0 0%, #FFF5DF 100%);
   border-radius: 7px;
 
   .title {
@@ -24,7 +23,7 @@
     align-items: center;
     justify-content: flex-end;
     & > div {
-      margin-right: 14px;
+      margin-left: 14px;
       display: flex;
       align-items: center;
       font-size: 12px;
@@ -39,7 +38,7 @@
   }
 
   .hotGoodsSection {
-    padding: 0 8px;
+    padding: 0 8px 8px 8px;
     display: flex;
     justify-content: space-between;
     align-items: center;
@@ -54,3 +53,9 @@
     overflow: hidden;
   }
 }
+.hotGoodsWrap{
+  padding: 10px 8px 9px 8px;
+}
+.hotIcon{
+  height: 18px;
+}

src/views/shop-mall/components/hot-goods/index.tsx

@@ -23,10 +23,9 @@ export default defineComponent({
   render() {
     return (
       <div class={styles.hotGoods}>
-        <Row style={{ padding: '9px 0 6px' }}>
+        <Row class={styles.hotGoodsWrap}>
           <Col span={8} class={styles.title}>
-            <Icon name={getAssetsHomeFile('icon-fire.png')} size={18} />
-            热销商品
+            <img class={styles.hotIcon} src={getAssetsHomeFile('icon-fire.png')} />
           </Col>
           <Col span={16} class={styles.tips}>
             <div>

src/views/shop-mall/images/bottom-line.svg

@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="20px" height="7px" viewBox="0 0 20 7" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>选中（弧形）备份</title>
+    <defs>
+        <linearGradient x1="0%" y1="-8.18438733%" x2="106.381755%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#2DC7AA" offset="0%"></stop>
+            <stop stop-color="#59E5D5" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="商城" transform="translate(-34.000000, -595.000000)" fill="url(#linearGradient-1)" fill-rule="nonzero">
+            <path d="M38.6153846,590 C39.5075369,590 40.2307692,590.723232 40.2307692,591.615385 C40.2307692,596.670914 44.3290858,600.769231 49.3846154,600.769231 C50.2767677,600.769231 51,601.492463 51,602.384615 C51,603.276768 50.2767677,604 49.3846154,604 C42.5447812,604 37,598.455219 37,591.615385 C37,590.723232 37.7232323,590 38.6153846,590 Z" id="选中（弧形）备份" transform="translate(44.000000, 597.000000) rotate(-45.000000) translate(-44.000000, -597.000000) "></path>
+        </g>
+    </g>
+</svg>

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

@@ -30,12 +30,26 @@
   }
 }
 .swipe {
-  margin: 14px;
+  margin: 11px 14px 0 14px;
+  height: 132px;
   border-radius: 10px;
   overflow: hidden;
-  height: 162px;
   .swipeItemImg {
-    height: 162px;
+    height: 100%;
     width: 100%;
   }
 }
+
+.tabs{
+  :global{
+    .van-tabs__line{
+      width: 20px !important;
+      height: 7px;
+      bottom: 0.5rem;
+      background-image: url('./images/bottom-line.svg');
+      background-repeat: no-repeat;
+      background-size: 100% 100%;
+      background-color: transparent !important;
+    }
+  }
+}

src/views/shop-mall/index.tsx

@@ -98,16 +98,14 @@ export default defineComponent({
             v-slots={{
               right: () => (
                 <div class={styles['icon-shop-cart']}>
-                  {/* {this.count > 0 && (
-                    <span class={styles.dot}>{this.count}</span>
-                  )} */}
                   <Badge
                     class={styles.iconBadge}
                     showZero={false}
+                    offset={[-8, 8]}
                     color="rgba(236,92,50,1)"
                     content={this.count}
                   >
-                    <Icon name={iconShopCart} size={24} />
+                    <Icon name={iconShopCart} size={30} />
                   </Badge>
                 </div>
               )
@@ -115,7 +113,7 @@ export default defineComponent({
             onHeaderBack={() => {
               this.$nextTick(() => {
                 const { height } = useRect((this as any).$refs.headers)
-                this.height = height
+                this.height = height - 1
               })
             }}
           />
@@ -145,7 +143,7 @@ export default defineComponent({
           >
             {this.advertiseList.map((item: any) => (
               <SwipeItem onClick={() => this.openWebView(item.url)}>
-                <Image class={styles.swipeItemImg} src={item.pic} fit="cover" />
+                <Image class={styles.swipeItemImg} src={item.pic} fit="fill" />
               </SwipeItem>
             ))}
           </Swipe>