GuangYuYuan-app/src/components/webviewPoint.vue

<template>
  <u-modal :show="show" title="恭喜您,中奖啦！！！" :show-cancel="false">
    <view slot="default" class="modal-content">
      <text class="modal-text">恭喜您获得转盘抽奖的机会！</text>
    </view>
    <view slot="confirmButton" class="modal-footer">
      <button class="modal-cancel" @click="show = false">取消</button>
      <wx-open-launch-weapp
          id="launch-btn"
          class="launch-weapp-btn"
          appid="wxab9634bf98628a03"
          :path="launchButtonHtml"
      >
        <script type="text/wxtag-template">
          <style scoped>
            .btn {
              width: 100%;
              height: 100%;
              font-size: 1rem;
              text-align: center;
              margin: 0; padding: 0;
              border: none;
              background: none;
              color: #FFFFFF; } </style>
          <button class="btn">去抽奖</button>
        </script>
      </wx-open-launch-weapp>
    </view>
  </u-modal>
</template>
<script>
import {handleServiceAdjustMiniProgram} from '@/utils/share.js'
export default {
  data() {
    return {
      show:false,
      launchButtonHtml: ''
    }
  },
  methods: {
    getRow(res){
      let activityUrl = res?.activityUrl.split('/#/')[1] || '';
      let activityId = res?.activityId;
      let currentPlatform = 'gyy-aB4cD6eF8gH0iJ2kL4';
      let currentUser = uni.getStorageSync('userId');
      let url = `/${activityUrl}?activityId=${activityId}&currentPlatform=${currentPlatform}&currentUser=${currentUser}`;
      this.initLaunchButton(url)
    },
    async initLaunchButton(url) {
      console.log(url)
      try {
        await handleServiceAdjustMiniProgram();
        this.show = true;
        this.launchButtonHtml = url;
      } catch (err) {
        console.error('初始化跳转按钮失败', err)
        this.launchButtonHtml = '';
      }
    },
  }
}
</script>

<style lang="scss" scoped>
::v-deep .u-modal {
  .u-modal__title {
    background: #E8FFFD;
    height: 92rpx;
    padding: 0;
    font-family: PingFang SC, PingFang SC;
    font-weight: bold;
    font-size: 32rpx;
    color: #000000;
    line-height: 92rpx;
  }

  .u-modal__content,
  .u-modal__button-group--confirm-button {
    padding: 0;
  }
}
// 模态框样式
.modal-content {
  padding: 40rpx 32rpx;
  text-align: center;

  .modal-text {
    font-family: PingFang SC, PingFang SC;
    font-weight: 500;
    font-size: 28rpx;
    color: #333333;
    line-height: 39rpx;
  }
}

.modal-footer {
  border-top: 1rpx solid #EEEEEE;
  display: flex;
  justify-content: center;
  padding: 24rpx 58rpx;

  button {
    width: 225rpx;
    height: 68rpx;
    border-radius: 60rpx;
    font-size: 1rem;
    text-align: center;
    line-height: 68rpx;
    margin: 0 20rpx;
    padding: 0;
  }

  .modal-cancel {
    border: 1rpx solid #999999;
    color: #333333;
  }

  .launch-weapp-btn {
    width: 225rpx;
    height: 68rpx;
    border-radius: 60rpx;
    margin: 0 20rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(78deg, #1AD8CF 0%, #21C8C0 100%);
  }
}
</style>