Merge remote-tracking branch 'origin/master'

doum

2026-04-25 b7d451c91ec40bee70f23b1e2cf6a8797643faef

 small-program/shop/pages/mine/mine.vue

@@ -1,13 +1,69 @@
<template>
   <view class="shop-mine-page">
      <view class="nav-bar" :style="{ paddingTop: statusbarHeight + 'px' }">
         <view class="nav-content">
            <text class="nav-title">我的</text>
      <view class="page-header">
         <view class="custom-nav">
            <view :style="{ height: statusbarHeight + 'px' }"></view>
            <view class="nav-content" :style="{ height: navHeight + 'px' }">
               <view class="logout-btn" @click="handleLogout">登出</view>
               <view class="nav-actions">
                  <image class="nav-action-icon" :src="navActionIcon" mode="aspectFit"></image>
               </view>
            </view>
         </view>

         <view :style="{ height: statusbarHeight + navHeight + 'px' }"></view>

         <view class="profile-section">
            <view class="profile-main">
               <view class="profile-left">
                  <image class="store-avatar" :src="storeAvatar" mode="aspectFill"></image>
                  <view class="profile-info">
                     <text class="store-name">{{ shopDisplayName }}</text>
                     <view class="profile-meta-row">
                        <text class="manager-name">{{ managerName }}</text>
                        <view class="identity-tag enterprise-tag">企业</view>
                        <view class="identity-tag personal-tag">个人</view>
                     </view>
                  </view>
               </view>
               <image class="setting-icon" src="/static/icon/ic_option@2x.png" mode="aspectFit" @click="junp"></image>
            </view>
         </view>
      </view>
      <view class="page-content">
         <text>门店我的页面</text>

      <view class="page-body">
         <!-- <view class="card order-card">
            <view class="card-header">
               <text class="card-title">订单管理</text>
               <view class="header-link" @click="goAllOrders">
                  <text>全部订单</text>
                  <text class="header-arrow">></text>
               </view>
            </view>

            <view class="order-grid">
               <view class="order-item" v-for="item in orderMenus" :key="item.title" @click="handleOrderClick(item)">
                  <view class="order-icon-wrap">
                     <image class="order-icon" :src="item.icon" mode="aspectFit"></image>
                     <view v-if="item.badge" class="order-badge">{{ item.badge }}</view>
                  </view>
                  <text class="order-title">{{ item.title }}</text>
               </view>
            </view>
         </view> -->

         <view class="banner-card">
            <image class="banner-image" src="/static/image/share@2x.png" mode="widthFix"></image>
         </view>

         <view class="card menu-card">
            <view class="menu-item" v-for="item in menuList" :key="item.title" @click="handleMenuClick(item)">
               <text class="menu-title">{{ item.title }}</text>
               <image src="/static/icon/ar_map@2x.png" mode="widthFix" class="menu-arrow"></image>
            </view>
         </view>
      </view>

      <custom-tabbar></custom-tabbar>
   </view>
</template>
@@ -20,8 +76,77 @@
      components: {
         CustomTabbar
      },
      data() {
         return {
            navActionIcon: '',
            settingIcon: '',
            storeAvatar: '',
            bannerImage: '',
            orderMenus: [
               { title: '待核验', badge: 12, icon: '/static/icon/mine_ic_daifukuan@2x.png', url: '/shop/pages/write-off/write-off' },
               { title: '待收货', badge: 2, icon: '/static/icon/mine_ic_daishouhuo@2x.png', url: '' },
               { title: '退款/售后', badge: '', icon: '/static/icon/mine_ic_tuikuan@2x.png', url: '' }
            ],
            menuList: [
               { title: '规范须知', url: '' },
               { title: '在线客服', url: '' },
               { title: '关于我们', url: '' }
            ]
         }
      },
      computed: {
         ...mapState(['statusbarHeight'])
         ...mapState(['navHeight', 'statusbarHeight', 'shopInfo']),
         shopDisplayName() {
            return this.shopInfo.shopName || '中铁快运南站旗舰店'
         },
         managerName() {
            return this.shopInfo.contactName || this.shopInfo.managerName || '蔡子瑶'
         }
      },
      methods: {
         junp() {
            uni.navigateTo({
               url: '/shop/pages/settings/settings'
            })
         },
         handleLogout() {
            uni.showToast({
               title: '请接入登出逻辑',
               icon: 'none'
            })
         },
         goAllOrders() {
            uni.showToast({
               title: '请接入订单列表',
               icon: 'none'
            })
         },
         handleOrderClick(item) {
            if (!item.url) {
               uni.showToast({
                  title: '请补充跳转链接',
                  icon: 'none'
               })
               return
            }

            uni.navigateTo({
               url: item.url
            })
         },
         handleMenuClick(item) {
            if (!item.url) {
               uni.showToast({
                  title: '请补充页面链接',
                  icon: 'none'
               })
               return
            }

            uni.navigateTo({
               url: item.url
            })
         }
      }
   }
</script>
@@ -29,33 +154,269 @@
<style lang="scss" scoped>
   .shop-mine-page {
      min-height: 100vh;
      background: #f8f8f8;
      background: #f5f7fa;
   }

   .nav-bar {
   .page-header {
      background: linear-gradient(180deg, #bfefff 0%, #e7f9ff 68%, #f5f7fa 100%);
   }

   .custom-nav {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      background: #ffffff;
      z-index: 100;
      background: linear-gradient(180deg, #bfefff 0%, #dff7ff 100%);
   }

   .nav-content {
      height: 44px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 30rpx;
   }

   .logout-btn {
      min-width: 104rpx;
      height: 52rpx;
      padding: 0 24rpx;
      border-radius: 28rpx;
      background: rgba(255, 255, 255, 0.96);
      font-size: 24rpx;
      font-weight: 500;
      color: #2c4e68;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 10rpx 24rpx rgba(76, 128, 160, 0.08);
   }

   .nav-actions {
      width: 64rpx;
      height: 64rpx;
      display: flex;
      align-items: center;
      justify-content: center;
   }

   .nav-title {
      font-size: 34rpx;
   .nav-action-icon {
      width: 44rpx;
      height: 44rpx;
   }

   .profile-section {
      padding: 16rpx 30rpx 36rpx;
   }

   .profile-main {
      display: flex;
      align-items: center;
      justify-content: space-between;
   }

   .profile-left {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
   }

   .store-avatar {
      width: 112rpx;
      height: 112rpx;
      border-radius: 56rpx;
      background: #d5dde5;
      flex-shrink: 0;
   }

   .profile-info {
      flex: 1;
      min-width: 0;
      padding-left: 24rpx;
   }

   .setting-icon {
      width: 40rpx;
      height: 40rpx;
      margin-left: 20rpx;
      flex-shrink: 0;
   }

   .store-name {
      display: block;
      font-size: 42rpx;
      font-weight: 700;
      line-height: 1.25;
      color: #1f2b3d;
   }

   .profile-meta-row {
      margin-top: 16rpx;
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 12rpx;
   }

   .manager-name {
      font-size: 26rpx;
      color: #506070;
   }

   .identity-tag {
      height: 34rpx;
      padding: 0 14rpx;
      border-radius: 18rpx;
      font-size: 20rpx;
      font-weight: 600;
      color: #ffffff;
      display: flex;
      align-items: center;
      justify-content: center;
   }

   .enterprise-tag {
      background: linear-gradient(135deg, #ff9a45 0%, #ff6a3d 100%);
   }

   .personal-tag {
      background: linear-gradient(135deg, #54d1ff 0%, #24b9dd 100%);
   }

   .page-body {
      padding: 0 30rpx calc(180rpx + env(safe-area-inset-bottom));
      margin-top: -6rpx;
   }

   .card {
      background: #ffffff;
      border-radius: 24rpx;
      box-shadow: 0 12rpx 30rpx rgba(31, 76, 112, 0.06);
   }

   .order-card {
      padding: 30rpx 28rpx 22rpx;
   }

   .card-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
   }

   .card-title {
      font-size: 34rpx;
      font-weight: 700;
      color: #222f3e;
   }

   .header-link {
      display: flex;
      align-items: center;
      font-size: 24rpx;
      color: #9aa6b2;
   }

   .header-arrow {
      margin-left: 8rpx;
      font-size: 22rpx;
   }

   .order-grid {
      margin-top: 26rpx;
      display: flex;
      justify-content: space-between;
      gap: 16rpx;
   }

   .order-item {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 10rpx 0;
   }

   .order-icon-wrap {
      position: relative;
      width: 72rpx;
      height: 72rpx;
      display: flex;
      align-items: center;
      justify-content: center;
   }

   .order-icon {
      width: 60rpx;
      height: 60rpx;
   }

   .order-badge {
      position: absolute;
      top: -8rpx;
      right: -10rpx;
      min-width: 32rpx;
      height: 32rpx;
      padding: 0 8rpx;
      border-radius: 16rpx;
      background: #ff3558;
      font-size: 20rpx;
      font-weight: 600;
      color: #ffffff;
      display: flex;
      align-items: center;
      justify-content: center;
      box-sizing: border-box;
   }

   .order-title {
      margin-top: 8rpx;
      font-weight: 400;
      font-size: 24rpx;
      color: #333333;
   }

   .page-content {
      padding-top: calc(44px + 44px);
      min-height: 100vh;
   .banner-card {
      margin-top: 24rpx;
      border-radius: 20rpx;
      overflow: hidden;
      background: linear-gradient(135deg, #0d63d5 0%, #8fd9ff 100%);
   }

   .banner-image {
      display: block;
      width: 100%;
      height: 184rpx;
      background: linear-gradient(135deg, #0d63d5 0%, #8fd9ff 100%);
   }

   .menu-card {
      margin-top: 24rpx;
      padding: 0 24rpx;
   }

   .menu-item {
      height: 102rpx;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1rpx solid #edf1f5;
   }

   .menu-item:last-child {
      border-bottom: none;
   }

   .menu-title {
      font-weight: 400;
      font-size: 30rpx;
      color: #222222;
   }

   .menu-arrow {
      width: 16rpx;
      height: 26rpx;
   }
</style>