li.shaoyi 2 éve
szülő
commit
df38616c4b
35 módosított fájl, 202 hozzáadás és 123 törlés
  1. BIN
      src/packages/mobile/assets/icons/cart.png
  2. BIN
      src/packages/mobile/assets/icons/ccwl.png
  3. BIN
      src/packages/mobile/assets/icons/cpjg.png
  4. BIN
      src/packages/mobile/assets/icons/cpjs.png
  5. BIN
      src/packages/mobile/assets/icons/fire.png
  6. BIN
      src/packages/mobile/assets/icons/friend.png
  7. BIN
      src/packages/mobile/assets/icons/gold.png
  8. BIN
      src/packages/mobile/assets/icons/home-active.png
  9. BIN
      src/packages/mobile/assets/icons/home.png
  10. BIN
      src/packages/mobile/assets/icons/htzr.png
  11. BIN
      src/packages/mobile/assets/icons/mine-active.png
  12. BIN
      src/packages/mobile/assets/icons/mine.png
  13. BIN
      src/packages/mobile/assets/icons/order.png
  14. BIN
      src/packages/mobile/assets/icons/ptgz.png
  15. BIN
      src/packages/mobile/assets/icons/purchase-active.png
  16. BIN
      src/packages/mobile/assets/icons/purchase.png
  17. BIN
      src/packages/mobile/assets/icons/red-envelope.png
  18. BIN
      src/packages/mobile/assets/icons/schedule.png
  19. BIN
      src/packages/mobile/assets/icons/signin.png
  20. BIN
      src/packages/mobile/assets/icons/statement.png
  21. BIN
      src/packages/mobile/assets/icons/supply-demand-active.png
  22. BIN
      src/packages/mobile/assets/icons/supply-demand.png
  23. BIN
      src/packages/mobile/assets/icons/useradd.png
  24. BIN
      src/packages/mobile/assets/icons/wdrw.png
  25. 2 2
      src/packages/mobile/components/base/tabbar/index.vue
  26. 17 17
      src/packages/mobile/components/layouts/navbar/index.less
  27. 5 3
      src/packages/mobile/views/bank/wallet/components/deposit/index.vue
  28. 58 44
      src/packages/mobile/views/credit/signin/index.less
  29. 47 23
      src/packages/mobile/views/credit/signin/index.vue
  30. 22 0
      src/packages/mobile/views/home/components/main/index.less
  31. 22 12
      src/packages/mobile/views/home/components/main/index.vue
  32. 7 10
      src/packages/mobile/views/home/index.less
  33. 12 8
      src/packages/mobile/views/home/index.vue
  34. 6 0
      src/packages/mobile/views/mine/order/list/index.less
  35. 4 4
      src/packages/mobile/views/mine/order/list/index.vue

BIN
src/packages/mobile/assets/icons/cart.png


BIN
src/packages/mobile/assets/icons/ccwl.png


BIN
src/packages/mobile/assets/icons/cpjg.png


BIN
src/packages/mobile/assets/icons/cpjs.png


BIN
src/packages/mobile/assets/icons/fire.png


BIN
src/packages/mobile/assets/icons/friend.png


BIN
src/packages/mobile/assets/icons/gold.png


BIN
src/packages/mobile/assets/icons/home-active.png


BIN
src/packages/mobile/assets/icons/home.png


BIN
src/packages/mobile/assets/icons/htzr.png


BIN
src/packages/mobile/assets/icons/mine-active.png


BIN
src/packages/mobile/assets/icons/mine.png


BIN
src/packages/mobile/assets/icons/order.png


BIN
src/packages/mobile/assets/icons/ptgz.png


BIN
src/packages/mobile/assets/icons/purchase-active.png


BIN
src/packages/mobile/assets/icons/purchase.png


BIN
src/packages/mobile/assets/icons/red-envelope.png


BIN
src/packages/mobile/assets/icons/schedule.png


BIN
src/packages/mobile/assets/icons/signin.png


BIN
src/packages/mobile/assets/icons/statement.png


BIN
src/packages/mobile/assets/icons/supply-demand-active.png


BIN
src/packages/mobile/assets/icons/supply-demand.png


BIN
src/packages/mobile/assets/icons/useradd.png


BIN
src/packages/mobile/assets/icons/wdrw.png


+ 2 - 2
src/packages/mobile/components/base/tabbar/index.vue

@@ -8,8 +8,8 @@
             <!--判断是否图片图标-->
             <template v-if="item.iconType === 'image'">
               <div :class="['g-icon', selectedIndex === index && 'active']">
-                <img :src="item.icon" v-if="selectedIndex === index" />
-                <img :src="item.activeIcon" v-else />
+                <img :src="item.activeIcon" v-if="selectedIndex === index" />
+                <img :src="item.icon" v-else />
                 <span>{{ item.label }}</span>
               </div>
             </template>

+ 17 - 17
src/packages/mobile/components/layouts/navbar/index.less

@@ -3,41 +3,41 @@
 
     &__wrapper {
         background: var(--navbar-background);
-        color     : var(--navbar-color);
+        color: var(--navbar-color);
     }
 
     &__backbutton {
         position: absolute;
-        z-index : 1;
+        z-index: 1;
 
         &:empty {
             display: none;
         }
 
         >.van-icon {
-            display        : inline-flex;
-            align-items    : center;
+            display: inline-flex;
+            align-items: center;
             justify-content: center;
-            height         : var(--navbar-height);
-            line-height    : 1;
-            font-size      : .36rem;
-            color          : var(--navbar-backbutton-color);
-            cursor         : pointer;
-            padding        : 0 .28rem;
+            height: var(--navbar-height);
+            line-height: 1;
+            font-size: .36rem;
+            color: var(--navbar-backbutton-color);
+            cursor: pointer;
+            padding: 0 .28rem;
         }
     }
 
     &__header {
-        display    : flex;
+        display: flex;
         align-items: center;
 
         >.column {
-            flex           : 1;
-            display        : inline-flex;
+            flex: 1;
+            display: inline-flex;
             justify-content: center;
-            align-items    : center;
-            height         : var(--navbar-height);
-            white-space    : nowrap;
+            align-items: center;
+            height: var(--navbar-height);
+            white-space: nowrap;
 
             &--left>.column-block {
                 margin-right: auto;
@@ -48,7 +48,7 @@
             }
 
             &--center {
-                flex     : auto;
+                flex: auto;
                 font-size: .36rem;
             }
         }

+ 5 - 3
src/packages/mobile/views/bank/wallet/components/deposit/index.vue

@@ -4,10 +4,10 @@
             <CellGroup inset>
                 <Field type="number" v-model="formData.Amount" label="充值金额" placeholder="请填写充值金额"
                     :rules="formRules.Amount" />
-                <Field label="凭证">
+                <Field label="凭证" :rules="formRules.fileList">
                     <template #input>
                         <Uploader v-model="fileList" name="fileList" :max-size="5 * 1024 * 1024" @oversize="onOversize"
-                            max-count="1" :after-read="afterRead" :rules="formRules.fileList" />
+                            max-count="1" :after-read="afterRead" />
                     </template>
                 </Field>
             </CellGroup>
@@ -77,8 +77,10 @@ const formRules: { [key in keyof Proto.t2bBankDepositReq | 'fileList']?: FieldRu
         message: '请填写充值金额',
     }],
     fileList: [{
-        required: true,
         message: '请上传转账凭证',
+        validator: () => {
+            return fileList.value.length > 0
+        }
     }]
 }
 

+ 58 - 44
src/packages/mobile/views/credit/signin/index.less

@@ -1,5 +1,5 @@
 .credit-signin {
-    @backgroundImage: linear-gradient(#DD364A, #C30D23 3.9rem, transparent 3.9rem);
+    @backgroundImage: linear-gradient(#DD364A, #C30D23 3.2rem, transparent 3.2rem);
 
     .app-navbar {
         background-image: @backgroundImage;
@@ -16,16 +16,15 @@
 
     &__header {
         color: #000;
-        background-color: #fff;
         background-image: @backgroundImage;
-        padding: .36rem;
+        padding: .36rem .2rem;
         padding-bottom: 0;
 
         &-wrapper {
-            background-color: #fff;
-            border-top-left-radius: .2rem;
-            border-top-right-radius: .2rem;
-            padding: .24rem;
+            background: #fff url('@mobile/assets/images/block-bg.png') no-repeat center bottom;
+            background-size: 100%;
+            border-top-left-radius: .1rem;
+            border-top-right-radius: .1rem;
         }
 
         .integral {
@@ -35,42 +34,48 @@
             padding-top: .36rem;
 
             &-title {
-                font-size: .32rem;
-                color: #666;
+                display: flex;
+                align-items: center;
+                margin-top: .1rem;
+
+                img {
+                    width: .32rem;
+                    height: .32rem;
+                }
 
-                .app-iconfont__label {
-                    margin-left: .08rem;
+                span {
+                    font-size: .24rem;
+                    margin-left: .1rem;
                 }
             }
 
             &-balance {
-                font-size: .56rem;
+                font-size: .48rem;
                 font-weight: bold;
-                margin-top: .2rem;
+                color: #C30D23;
             }
         }
 
         .iconbar {
-            padding: .32rem;
+            padding: .48rem 0;
 
             ul {
                 display: flex;
-                justify-content: space-between;
 
                 li {
+                    flex: 1;
                     display: flex;
                     flex-direction: column;
                     align-items: center;
 
-                    .app-iconfont {
-                        &__icon {
-                            font-size: .96rem;
-                        }
+                    img {
+                        width: .72rem;
+                        height: .72rem;
+                    }
 
-                        &__label {
-                            font-size: .32rem;
-                            margin-top: .12rem;
-                        }
+                    span {
+                        font-size: .24rem;
+                        margin-top: .1rem;
                     }
                 }
             }
@@ -78,50 +83,59 @@
     }
 
     &__task {
-        background-color: #fff;
-        padding: .32rem;
-        padding-top: 0;
+        padding: .2rem;
 
         .list {
+            background-color: #fff;
+            border-radius: .1rem;
+
             &-title {
-                font-size: .4rem;
+                font-size: .32rem;
                 font-weight: bold;
+                padding: .28rem;
+                padding-bottom: 0;
             }
 
             &-item {
                 display: flex;
                 justify-content: space-between;
                 align-items: center;
-                padding: .24rem 0;
+                padding: .24rem .2rem;
 
                 &__title {
                     display: flex;
                     align-items: center;
 
-                    .icon-title {
-                        .app-iconfont__icon {
-                            font-size: .48rem;
-                            margin-right: .12rem;
-                        }
-
-                        .app-iconfont__label {
-                            font-size: .32rem;
+                    .title-icon {
+                        img {
+                            width: .72rem;
+                            height: .72rem;
                         }
                     }
 
-                    .icon-score {
-                        font-size: .24rem;
-                        font-weight: bold;
-                        color: #FB560A;
-                        margin-left: .12rem;
+                    .title-content {
+                        margin-left: .1rem;
+
+                        span {
+                            display: block;
+
+                            &:first-child {
+                                margin-bottom: .04rem;
+                            }
+
+                            &:last-child {
+                                font-size: .24rem;
+                                color: #C30D23;
+                            }
+                        }
                     }
                 }
 
                 &__button {
                     .van-button {
-                        width: 1.6rem;
-                        height: .64rem;
-                        background: linear-gradient(270deg, #FF5842 0%, #FF8259 100%);
+                        width: 1.4rem;
+                        height: .48rem;
+                        font-size: .24rem;
                         border: 0;
                     }
                 }

+ 47 - 23
src/packages/mobile/views/credit/signin/index.vue

@@ -6,28 +6,28 @@
         <div ref="headerRef" class="credit-signin__header">
             <div class="credit-signin__header-wrapper">
                 <div class="integral">
-                    <div class="integral-title">
-                        <app-iconfont icon="icon-jifenyue">积分余额</app-iconfont>
-                    </div>
                     <div class="integral-balance">
                         {{ userAccount.curscore ?? 0 }}
                     </div>
+                    <div class="integral-title">
+                        <img src="@mobile/assets/icons/gold.png" />
+                        <span>积分余额</span>
+                    </div>
                 </div>
                 <div class="iconbar">
                     <ul>
                         <li @click="userSignin">
-                            <app-iconfont icon="icon-qiandao" label-direction="bottom">
-                                <span v-if="userAccount.issigned">已签到</span>
-                                <span v-else>签到</span>
-                            </app-iconfont>
+                            <img src="@mobile/assets/icons/schedule.png" />
+                            <span v-if="userAccount.issigned">已签到</span>
+                            <span v-else>签到</span>
                         </li>
                         <li>
-                            <app-iconfont icon="icon-jifenchoujiang" label-direction="bottom"
-                                @click="routerTo('credit-lottery')">积分红包</app-iconfont>
+                            <img src="@mobile/assets/icons/red-envelope.png" @click="routerTo('credit-lottery')" />
+                            <span>积分红包</span>
                         </li>
                         <li>
-                            <app-iconfont icon="icon-jifenliushui" label-direction="bottom"
-                                @click="routerTo('credit-statement')">积分流水</app-iconfont>
+                            <img src="@mobile/assets/icons/statement.png" @click="routerTo('credit-statement')" />
+                            <span>积分流水</span>
                         </li>
                     </ul>
                 </div>
@@ -38,20 +38,35 @@
                 <dt class="list-title">积分任务</dt>
                 <dd class="list-item">
                     <div class="list-item__title">
-                        <app-iconfont class="icon-title" icon="icon-meiriqiandao">每日签到</app-iconfont>
-                        <app-iconfont class="icon-score" icon="icon-jifenyue">+{{ getScoreConfig(2) }}</app-iconfont>
+                        <div class="title-icon">
+                            <img src="@mobile/assets/icons/signin.png" />
+                        </div>
+                        <div class="title-content">
+                            <span>每日签到</span>
+                            <span>积分+{{ getScoreConfig(2) }}</span>
+                        </div>
                     </div>
                 </dd>
                 <dd class="list-item">
                     <div class="list-item__title">
-                        <app-iconfont class="icon-title" icon="icon-haoyouxiadan">好友下单每次</app-iconfont>
-                        <app-iconfont class="icon-score" icon="icon-jifenyue">+{{ getScoreConfig(4) }}</app-iconfont>
+                        <div class="title-icon">
+                            <img src="@mobile/assets/icons/friend.png" />
+                        </div>
+                        <div class="title-content">
+                            <span>好友下单每次</span>
+                            <span>积分+{{ getScoreConfig(4) }}</span>
+                        </div>
                     </div>
                 </dd>
                 <dd class="list-item">
                     <div class="list-item__title">
-                        <app-iconfont class="icon-title" icon="icon-yaoqingxinrenzhuce">邀请新人注册</app-iconfont>
-                        <app-iconfont class="icon-score" icon="icon-jifenyue">+{{ getScoreConfig(3) }}</app-iconfont>
+                        <div class="title-icon">
+                            <img src="@mobile/assets/icons/useradd.png" />
+                        </div>
+                        <div class="title-content">
+                            <span>邀请新人注册</span>
+                            <span>积分+{{ getScoreConfig(3) }}</span>
+                        </div>
                     </div>
                     <div class="list-item__button">
                         <Button type="primary" @click="routerTo('mine-generalize')" round>去完成</Button>
@@ -59,8 +74,13 @@
                 </dd>
                 <dd class="list-item">
                     <div class="list-item__title">
-                        <app-iconfont class="icon-title" icon="icon-caigouxiadan">采购下单每次</app-iconfont>
-                        <app-iconfont class="icon-score" icon="icon-jifenyue">+{{ getScoreConfig(5) }}</app-iconfont>
+                        <div class="title-icon">
+                            <img src="@mobile/assets/icons/cart.png" />
+                        </div>
+                        <div class="title-content">
+                            <span>采购下单每次</span>
+                            <span>积分+{{ getScoreConfig(5) }}</span>
+                        </div>
                     </div>
                     <div class="list-item__button">
                         <Button type="primary" round @click="toPurchase">去完成</Button>
@@ -68,8 +88,13 @@
                 </dd>
                 <dd class="list-item" v-if="false">
                     <div class="list-item__title">
-                        <app-iconfont class="icon-title" icon="icon-gongqiuxiadan">供求下单每次</app-iconfont>
-                        <app-iconfont class="icon-score" icon="icon-jifenyue">+{{ getScoreConfig(6) }}</app-iconfont>
+                        <div class="title-icon">
+                            <img src="@mobile/assets/icons/order.png" />
+                        </div>
+                        <div class="title-content">
+                            <span>供求下单每次</span>
+                            <span>积分+{{ getScoreConfig(6) }}</span>
+                        </div>
                     </div>
                     <div class="list-item__button">
                         <Button type="primary" round @click="toSupplyDemand">去完成</Button>
@@ -82,14 +107,13 @@
 
 <script lang="ts" setup>
 import { shallowRef, onActivated } from 'vue'
-import {showSuccessToast, showFailToast, Button } from 'vant'
+import { showSuccessToast, showFailToast, Button } from 'vant'
 import { fullloading } from '@/utils/vant'
 import { useLoginStore } from '@/stores'
 import { queryUserAccount } from '@/services/api/account'
 import { queryTHJScoreConfig } from '@/services/api/credit'
 import { signin } from '@/services/api/common'
 import { useNavigation } from '@/hooks/navigation'
-import AppIconfont from '@mobile/components/base/iconfont/index.vue'
 
 const { getUserId } = useLoginStore()
 const { routerTo, backTo } = useNavigation()

+ 22 - 0
src/packages/mobile/views/home/components/main/index.less

@@ -26,6 +26,8 @@
         }
 
         &--header {
+            margin-top: .28rem;
+
             .van-swipe {
                 min-height: 3rem;
                 border-radius: .1rem;
@@ -65,8 +67,20 @@
             padding-top: .24rem;
 
             li {
+                display: flex;
+                flex-direction: column;
+                align-items: center;
                 width: calc(~'100% / 3');
                 text-align: center;
+
+                img {
+                    width: .8rem;
+                    height: .8rem;
+                }
+
+                span {
+                    font-size: .24rem;
+                }
             }
         }
 
@@ -143,8 +157,16 @@
 
         .titlebar {
             &-title {
+                display: flex;
+                align-items: center;
                 font-size: .32rem;
                 font-weight: bold;
+
+                img {
+                    width: .32rem;
+                    height: .32rem;
+                    margin-right: .1rem;
+                }
             }
 
             &-more {

+ 22 - 12
src/packages/mobile/views/home/components/main/index.vue

@@ -4,7 +4,7 @@
       <app-navbar title="铁合金掌上行" :show-back-button="false" />
     </template>
     <app-statusbar class="home-main__header">
-      <div class="home-main__banner home-main__banner--header" style="margin-top:.28rem">
+      <div class="home-main__banner home-main__banner--header">
         <Swipe :autoplay="5000" indicator-color="white" lazy-render>
           <SwipeItem v-for="(item, index) in topBanners" :key="index">
             <img :src="getImageUrl(item.imagepath)" />
@@ -16,28 +16,34 @@
       <div class="home-main__iconbar">
         <ul>
           <li @click="routerTo('product')">
-            <app-iconfont icon="icon-chanpinjieshao" label-direction="bottom">产品介绍</app-iconfont>
+            <img src="@mobile/assets/icons/cpjs.png" />
+            <span>产品介绍</span>
           </li>
           <li @click="routerTo('Market')">
-            <app-iconfont icon="icon-maoyirongzi" label-direction="bottom">产品价格</app-iconfont>
+            <img src="@mobile/assets/icons/cpjg.png" />
+            <span>产品价格</span>
           </li>
           <li @click="routerTo('NavigationPTGZ')">
-            <app-iconfont icon="icon-pingtaiguize" label-direction="bottom">平台规则</app-iconfont>
+            <img src="@mobile/assets/icons/ptgz.png" />
+            <span>平台规则</span>
           </li>
         </ul>
         <ul>
           <li @click="routerTo('credit-signin')">
-            <app-iconfont icon="icon-woderenwu" label-direction="bottom">我的任务</app-iconfont>
+            <img src="@mobile/assets/icons/wdrw.png" />
+            <span>我的任务</span>
           </li>
           <li @click="routerTo('contract')">
-            <app-iconfont icon="icon-chanpinjiage" label-direction="bottom">合同转让</app-iconfont>
+            <img src="@mobile/assets/icons/htzr.png" />
+            <span>合同转让</span>
           </li>
           <li @click="routerTo('rules-ccwl')">
-            <app-iconfont icon="icon-a-bianzu12" label-direction="bottom">仓储物流</app-iconfont>
+            <img src="@mobile/assets/icons/ccwl.png" />
+            <span>仓储物流</span>
           </li>
         </ul>
       </div>
-      <div class="home-main__market">
+      <div class="home-main__market" v-if="false">
         <div class="left">
           <h2>合金指数</h2>
           <span>{{ formatDate(marketRun.tradedate, "YYYY-MM-DD") }}</span>
@@ -59,7 +65,7 @@
           </Swipe>
         </div>
       </div>
-      <div class="home-main__banner home-main__banner--body">
+      <div class="home-main__banner home-main__banner--body" v-if="false">
         <Swipe :autoplay="5000" indicator-color="white" lazy-render>
           <SwipeItem v-for="(item, index) in bodyBanners" :key="index">
             <img :src="getImageUrl(item.imagepath)" />
@@ -67,8 +73,13 @@
         </Swipe>
       </div>
       <div class="home-main__news">
-        <Cell class="titlebar" title-class="titlebar-title" value-class="titlebar-more" title="市场资讯" value="更多"
-          :to="{ name: 'news-list' }" is-link />
+        <Cell class="titlebar" title-class="titlebar-title" value-class="titlebar-more" value="更多"
+          :to="{ name: 'news-list' }" is-link>
+          <template #title>
+            <img src="@mobile/assets/icons/fire.png" />
+            <span>市场资讯</span>
+          </template>
+        </Cell>
         <CellGroup class="article">
           <template v-for="(item, index) in newsList" :key="index">
             <Cell class="article-item" title-class="article-item__title" value-class="article-item__time"
@@ -97,7 +108,6 @@ import { queryImageConfigs } from "@/services/api/common";
 import { querySiteColumnDetail } from "@/services/api/news";
 import { useSpotGoodsPrice } from "@/business/market";
 import { queryMarketRun } from "@/services/api/goods";
-import AppIconfont from "@mobile/components/base/iconfont/index.vue";
 
 const { routerTo } = useNavigation();
 const { dataList, getSpotGoodsPrice } = useSpotGoodsPrice();

+ 7 - 10
src/packages/mobile/views/home/index.less

@@ -9,20 +9,17 @@
 
             &.is-active {
                 color: var(--tabbar-icon-active);
-
-                .app-iconfont__icon {
-                    animation: icon-scale 300ms;
-                }
             }
 
-            .app-iconfont {
-                &__icon {
-                    font-size: .48rem;
+            .g-icon {
+                img {
+                    width: .56rem;
+                    height: .56rem;
                 }
+            }
 
-                &__label {
-                    margin-top: .08rem;
-                }
+            span {
+                margin-top: 0 !important;
             }
         }
     }

+ 12 - 8
src/packages/mobile/views/home/index.vue

@@ -35,26 +35,30 @@ const tabList: Tabbar[] = [
   {
     name: 'home',
     label: '首页',
-    icon: 'icon-thj-logo-un',
-    activeIcon: 'icon-thj-logo'
+    iconType: 'image',
+    icon: require('@mobile/assets/icons/home.png'),
+    activeIcon: require('@mobile/assets/icons/home-active.png'),
   },
   {
     name: 'purchase',
     label: '采购',
-    icon: 'icon-caigou-1',
-    activeIcon: 'icon-caigou'
+    iconType: 'image',
+    icon: require('@mobile/assets/icons/purchase.png'),
+    activeIcon: require('@mobile/assets/icons/purchase-active.png'),
   },
   // {
   //   name: 'supplyDemand',
   //   label: '供求',
-  //   icon: 'icon-gongqiu-1',
-  //   activeIcon: 'icon-gongqiu'
+  //   iconType: 'image',
+  //   icon: require('@mobile/assets/icons/supply-demand.png'),
+  //   activeIcon: require('@mobile/assets/icons/supply-demand-active.png'),
   // },
   {
     name: 'mine',
     label: '我的',
-    icon: 'icon-wode-1',
-    activeIcon: 'icon-wode'
+    iconType: 'image',
+    icon: require('@mobile/assets/icons/mine.png'),
+    activeIcon: require('@mobile/assets/icons/mine-active.png'),
   }
 ]
 

+ 6 - 0
src/packages/mobile/views/mine/order/list/index.less

@@ -14,6 +14,12 @@
         }
     }
 
+    &__navbar {
+        .button-more {
+            height: 100%;
+        }
+    }
+
     &__wrapper {
         .section {
             padding: .2rem;

+ 4 - 4
src/packages/mobile/views/mine/order/list/index.vue

@@ -2,12 +2,12 @@
 <template>
     <app-view class="order-list">
         <template #header>
-            <app-navbar title="我的订单">
+            <app-navbar class="order-list__navbar" title="我的订单">
                 <template #right>
-                    <Button @click="onMoreClick" v-if="activeTab != 2">
+                    <div class="button-more" @click="onMoreClick" v-if="activeTab != 2">
                         <span v-if="activeTab === 1">已成交</span>
                         <span v-else>更多</span>
-                    </Button>
+                    </div>
                 </template>
             </app-navbar>
         </template>
@@ -33,7 +33,7 @@
 
 <script lang="ts" setup>
 import { shallowRef } from 'vue'
-import { Tab, Tabs, Button } from 'vant'
+import { Tab, Tabs } from 'vant'
 import { useNavigation } from '@/hooks/navigation'
 import PurchaseTrade from './components/purchasetrade/index.vue'
 import WrOrder from './components/wrorder/index.vue'