MrShi
12 小时以前 ac33a3140ef8ef20dfd2537fce2dfdd0f374f30e
mini-program/pages/share/share.vue
@@ -3,13 +3,15 @@
      <view class="head" :style="{ height: 'calc(' + (navHeight + statusbarHeight + 'px)') }">
         <view class="head-bar" :style="{ height: navHeight + statusbarHeight + 'px' }">
            <view :style="{ width: '100%', height: statusbarHeight + 'px' }"></view>
            <view class="head-bar-nav" :style="{ height: navHeight + 'px' }">
            <view class="head-bar-nav" :style="{ height: navHeight + 'px' }" @click="jumpBack">
               <image src="/static/icon/nav_ic_back@2x.png" mode="widthFix"></image>
               <text>分享</text>
            </view>
         </view>
      </view>
      <view class="image" :style="{ backgroundImage: 'url(' + backgroundImge + ')', top: -navHeight + 'px' }"></view>
      <view class="image" v-if="backgroundImge" :style="{ backgroundImage: 'url(' + backgroundImge + ')', top: -navHeight + 'px' }">
         <view class="info-rule" @click="jumpService">积分规则</view>
      </view>
      <view class="list">
         <view class="list-item">
            <view class="list-item-list">
@@ -28,55 +30,117 @@
                  <text>完成首单获优惠券</text>
               </view>
            </view>
            <view class="list-item-btn">立即邀请</view>
            <view class="list-item-btn" >
                  <button class="list-item-btn" open-type="share">立即邀请</button>
            </view>
            <view class="list-item-tips">成功邀请好友可享任务好礼</view>
         </view>
         <view class="list-item" style="margin-bottom: 40rpx;">
            <view class="list-item-cate">
               <view class="list-item-cate-item">
                  <text>已成功邀请(人)</text>
                  <text>5</text>
                  <text>{{info.inviteNum || 0}}</text>
               </view>
               <view class="list-item-cate-item">
                  <text>积分奖励</text>
                  <text>1000</text>
                  <text>{{info.num || 0}}</text>
               </view>
               <view class="list-item-cate-item">
               <view class="list-item-cate-item" @click="jumpCoupon()">
                  <text>优惠券奖励</text>
                  <text>查看</text>
               </view>
            </view>
         </view>
         <view class="list-item" style="padding-top: 50rpx; box-sizing: border-box;">
         <view class="list-item" style="padding-top: 50rpx; box-sizing: border-box;" v-if="info.inviteRecordList && info.inviteRecordList.length">
            <view class="list-item-top">
               <image src="/static/images/yaoqing_title@2x.png" mode="widthFix"></image>
            </view>
            <view class="list-item-row" v-for="(item, index) in 10" :key="index">
            <template v-if="info.inviteRecordList && info.inviteRecordList.length">
               <view class="list-item-row" v-for="(item, index) in info.inviteRecordList" :key="index">
               <view class="user">
                  <view class="user-image">
                     <image src="/static/logo.png" mode="widthFix"></image>
                        <image  :src="item.imgUrl?item.imgUrl:'/static/icon/default.png'" mode="widthFix"></image>
                  </view>
                  <view class="user-info">
                     <text>黄轩平</text>
                     <text>2025-11-21 19:12:32</text>
                        <text>{{item.memberName || item.memberNickname || ''}}</text>
                        <text>{{item.createDate || ''}}</text>
                  </view>
               </view>
               <view class="statis">完成首单</view>
                  <view class="statis"  v-if="item.firstOrderStatus ===1" >完成首单</view>
                  <view class="statis"  v-if="item.firstOrderStatus !==1" >已注册</view>
            </view>
            </template>
         </view>
      </view>
   </view>
</template>
<script>
   import { mapState } from 'vuex'
   export default {
      computed: {
         ...mapState(['navHeight', 'statusbarHeight'])
         ...mapState(['navHeight', 'statusbarHeight','userInfo'])
      },
      data() {
         return {
            backgroundImge: require('@/static/images/fenxiang_ic@2x.png')
            backgroundImge: null,
            info:{}
         }
      },
      onShow(){
         if(this.userInfo && this.userInfo.id){
             this.getDataList()
         }
      },
      onShareAppMessage() {
         var path = `/pages/index/index?ref=${Date.now()}`;
         if(this.userInfo && this.userInfo.id){
            path = `/pages/index/index?userId=${this.userInfo.id}&ref=${Date.now()}`
         }
         return {
            title: '鼎元农机商城-邀请好友',
            path:path,
            imageUrl: "/static/images/share.jpg"
         }
      },
      onLoad(){
          this.getBase64Img('/static/images/fenxiang_ic@2x.png')
      },
      methods:{
         async  getDataList(){
            var that =this
            let res = await that.$u.api.getInviteInfo();
            if (res.code === 200 ) {
               if ( res.data ) {
                  that.info=res.data || {}
               }
            }
         },
         getBase64Img(path){
            var that =this
            uni.getFileSystemManager().readFile({
              filePath: path, // 替换为你的图片路径
              encoding: 'base64',
              success: (res) => {
                const base64Data = 'data:image/png;base64,' + res.data; // 拼接前缀,用于页面显示
                that.backgroundImge = base64Data;
              },
              fail: (err) => {
                console.error('读取图片失败:', err);
              }
            });
         },
         jumpService() {
            uni.navigateTo({
               url: '/pagesA/pages/rich-text-page/rich-text-page?flag='+2
            })
         },
         jumpBack(){
            uni.navigateBack({delta:1})
         },
         jumpCoupon(){
            uni.navigateTo({
               url:"/pages/coupon/coupon"
            })
         }
      }
   }
@@ -84,6 +148,24 @@
<style lang="scss" scoped>
   .share {
      .info-rule{
         width: 30rpx;
         background: rgba(0,0,0,0.4);
         border-radius: 20rpx 0rpx 0rpx 20rpx;
         float: right;
         margin-top:150rpx;
         // height: 52rpx;
         padding: 16rpx 16rpx;
         font-family: PingFangSC, PingFang SC;
         font-weight: 400;
         font-size: 26rpx;
         color: #FFFFFF;
         line-height: 32rpx;
         text-align: right;
         font-style: normal;
      }
      width: 100%;
      background: linear-gradient( 180deg, #FE6D27 0%, #B11F00 100%);
      .head {