小程序改bug

MrShi

2026-04-28 bfd70830b78bc42e0a284baa044efacc29897cd5

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

@@ -1,13 +1,72 @@
<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"  @click="previewImage([info.shopAvatar],0)"  :src="(info.shopAvatar)?info.shopAvatar:'/static/icon/default2.png'"  mode="aspectFill"></image>
                  <view class="profile-info">
                     <text class="store-name">{{info.name||''}}</text>
                     <view class="profile-meta-row">
                        <text class="manager-name">{{info.linkName || ''}}</text>
                        <view class="identity-tag enterprise-tag" v-if="info.companyType === 1">企业</view>
                        <view class="identity-tag personal-tag" v-if="info.companyType === 0">个人</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>
               <view class="menu-arrow">
                  <button  v-if="item.title === '在线客服'" open-type="contact" type="default"> </button>
                  <image src="/static/icon/ar_map@2x.png" mode="widthFix"></image>
               </view>
            </view>
         </view>
      </view>

      <custom-tabbar></custom-tabbar>
   </view>
</template>
@@ -15,13 +74,119 @@
<script>
   import { mapState } from 'vuex'
   import CustomTabbar from '@/components/custom-tabbar/custom-tabbar.vue'

   export default {
      components: {
         CustomTabbar
      },
      computed: {
         ...mapState(['statusbarHeight'])
         ...mapState(['navHeight', 'statusbarHeight','shopInfo','shopToken']),
         shopDisplayName() {
            return this.shopInfo.shopName || ''
         },
         managerName() {
            return this.shopInfo.contactName || this.shopInfo.managerName || ''
         }
      },
      data() {
         return {
            navActionIcon: '',
            settingIcon: '',
            info:{},
            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: '/pages/rich-text/rich-text',type:2 },
               { title: '门店隐私政策', url: '/pages/rich-text/rich-text',type:3 },
               { title: '风险承诺', url: '/pages/rich-text/rich-text',type:6 },
               { title: '行李寄存须知', url: '/pages/rich-text/rich-text',type:7 },
               { title: '代理点合作协议', url: '/pages/rich-text/rich-text',type:8 },
               { title: '在线客服', url: null,type :-1 },
               { title: '关于我们', url: '/pages/rich-text/rich-text' ,type:5},
            ]
         }
      },
       onShow() {
         this.info  ={}
         this.getMyShop() 
       },
       onLoad(options) {
       },
      methods: {
         previewImage(images,index = 0) {
            uni.previewImage({
               current: index, 
               urls: images  
            });
         },
         async  getMyShop(index){
               var that =this 
               let res = await that.$u.api.getShopInfoDetail()
               if (res.code === 200) { 
                  this.info = res.data
                  console.log(this.info.laborContractImgUrls,this.info.laborContractImgUrls.length,"====================")
                   console.log(this.info,"====================")
               } 
         },
         junp() {
            uni.navigateTo({
               url: '/shop/pages/settings/settings'
            })
         },
         async handleLogout() {
            var that =this
            let res = await that.$u.api.logOutShop()
            if (res.code === 200) {
               uni.clearStorageSync("shopInfo")
               uni.clearStorageSync("shopToken")
               uni.navigateTo({
                  url:'/shop/pages/login/login'
               })
            } 
         },
         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
            }

            if(item.type > 0){
               uni.navigateTo({
                  url: '/pages/rich-text/rich-text?type='+item.type
               })
            }else{
               uni.navigateTo({
                  url: item.url
               })
            }
				
         }
      }
   }
</script>
@@ -29,33 +194,282 @@
<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 {
      display: inline-flex;
      button {
         position: relative;
         top: 0;
         float:right;
         right: 0;
         width: 200rpx;
         height: 26rpx;
         opacity: 0;
         z-index: 9999;
      }
      image{
         width: 16rpx;
         height: 26rpx;
      }
   }
</style>