menduner-uniapp/pagesA/integral/index.vue

<template>
  <layout-page>
    <view class="box defaultBgc">
      <scroll-view class="scrollBox" scroll-y="true" @scrolltolower="loadingMore">
        <view>
          <view class="panel">
            <view>
              <text class="text">{{ balance.point }}</text>
            </view>
            <!-- view>
              <button class="btn" @tap="handleUse">积分兑换</button>
            </view> -->
          </view>
          <view class="list">
            <uni-list>
              <uni-list-item
                v-for="item in items"
                :key="item.id"
                :title="item.description"
                :rightText="item._createTime"
              />
            </uni-list>
            <uni-load-more :status="more" />
          </view>
        </view>
      </scroll-view>

      <uni-popup ref="inputDialog" type="dialog">
        <view class="shareQrCodePopupContent">
          <view class="ss-m-b-10">请前往网页版门墩儿商城查看</view>
          <uni-link href="https://www.menduner.com/mall" text="点击复制网页地址" color="#00B760" fontSize="16" copyTips="已复制，请在电脑端打开"></uni-link>
        </view>
      </uni-popup>
    </view>
  </layout-page>
</template>
<!-- balance 余额 -->
<script setup>
import { ref } from 'vue'
import {
  getUserAccount,
  getEnterpriseAccountRecordPage
} from '@/api/sign'
import { timesTampChange } from '@/utils/date'

const balance = ref({})

const items = ref([])
const pageInfo = ref({
  pageNo: 1,
  pageSize: 20
})
const total = ref(0)
const more = ref('more')
const inputDialog = ref()

getBalance()
getList()
// 获取积分余额
async function getBalance() {
  const { data } = await getUserAccount()
  if (!data) {
    return
  }
  balance.value = data
}

async function getList () {
  try {
    const { data } = await getEnterpriseAccountRecordPage({ ...pageInfo.value, type: 0 })
    if (!data || !data.list) {
      if (pageInfo.value.pageNo === 1) {
        return
      }
      pageInfo.value.pageNo--
      more.value = 'more'
      return
    }
    const _data = data.list.map(e => {
      return {
        ...e,
        _createTime: timesTampChange(e.createTime)
      }
    })
    items.value.push(..._data)
    total.value = +data.total
    more.value = total.value <= items.value.length ? 'noMore' : 'more'
  } catch (error) {
    if (pageInfo.value.pageNo === 1) {
      return
    }
    pageInfo.value.pageNo--
    more.value = 'more'
  }
}
function loadingMore () {
  if (more.value === 'noMore') {
    return
  }
  more.value = 'loading'
  pageInfo.value.pageNo++
  getList()
}

function handleUse () {
  // wx.navigateToMiniProgram({  
  //   appId: 'wx6decdf12f9e7a061', // 目标小程序的 appId
  //   // envVersion: 'develop',
  //   success(res) {  
  //       // 打开成功  
  //       console.log('成功跳转至小程序:', res);  
  //   },  
  //   fail(err) {  
  //       // 打开失败
  //       uni.showToast({
  //         title: '打开商城失败',
  //         icon: 'none'
  //       })
  //   }  
  // })
  inputDialog.value.open()
}

</script>

<style lang="scss" scoped>
.box {
  height: 100vh;
}
.scrollBox {
  width: 100vw;
  // padding: 20rpx;
  box-sizing: border-box;
  .panel {
    position: sticky;
    z-index: 2;
    top: 0;
    width: 100%;
    padding: 20rpx;
    margin-bottom: 20rpx;
    box-sizing: border-box;
    background: #FFF;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    box-shadow: 0px 0px 10px 0px rgb(0, 0, 0, 0.25);
    .text {
      color: #F30;
      font-size: 54rpx;

    }
    .btn {
      width: 180rpx;
      height: 60rpx;
      line-height: 60rpx;
      font-size: 28rpx;
      text-align: center;
      background: #00B760;
      color: #FFF;
      border-radius: 30rpx;
    }
  }
  .list {
    // padding: 20rpx;
  }
}
.shareQrCodePopupContent {
	width: 75vw;
	padding: 40rpx;
	margin-bottom: 20rpx;
	text-align: center;
	background-color: #fff;
}
</style>