xiaoe_mp_npm 0.2.2-beta1 → 0.2.2-beta2

package/miniprogram_dist/AliveInvite/LiveRoomVertical/components/invite-poster/invite-poster.wxss

@@ -0,0 +1,167 @@
+/* associate/alive_pusher/components/invite-poster2/invite-poster2.wxss */
+.poster {
+  width: 100%;
+  height: 100vh;
+  z-index: 2;
+  position: fixed;
+  top: 0;
+  left: 0;
+  /* background-color: rgba(0, 0, 0, 0.6); */
+}
+.poster-wrap {
+  width: 100%;
+  height: 384rpx;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  background: rgba(0, 0, 0, 0.7);
+  border-radius: 16rpx 16rpx 0 0;
+  backdrop-filter: blur(16px);
+  animation: popping ease 300ms;
+}
+@keyframes popping {
+  from {
+    opacity: 0.5;
+  }
+  to {
+    opacity: 1;
+  }
+}
+.poster-header {
+  height: 176rpx;
+  color: #333;
+  font-family: PingFangSC-Medium;
+  font-size: 32rpx;
+  color: #FFFFFF;
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.close-icon-view {
+  width: 60rpx;
+  height: 60rpx;
+  position: absolute;
+  top: 64rpx;
+  right: 30rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.mask-layer {
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  background-color: #ffffff;
+  opacity: 0;
+}
+.poster-header_icon {
+  width: 48rpx;
+  height: 48rpx;
+}
+.header-text {
+  font-size: 36rpx;
+  height: 40rpx;
+  line-height: 40rpx;
+  color: #FFFFFF;
+}
+.poster-content {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-bottom: 16rpx;
+}
+.poster-content_image {
+  width: 420rpx;
+  height: 736rpx;
+  border-radius: 16rpx;
+  background-color: #D1E3FF;
+}
+.poster-list {
+  padding: 8rpx 68rpx 8rpx 0;
+  position: relative;
+}
+.scroll-view {
+  width: 100%;
+  position: relative;
+  white-space: nowrap;
+}
+.poster-item {
+  width: 68rpx;
+  height: 120rpx;
+  border-radius: 12rpx;
+  margin-left: 32rpx;
+  background-color: #D1E3FF;
+  display: inline-block;
+}
+.poster-list_mask {
+  width: 64rpx;
+  height: 152rpx;
+  position: absolute;
+  top: 0;
+  right: 0;
+  background: #FFFFFF;
+  box-shadow: -8px 0px 8px -8px rgba(0, 0, 0, 0.3);
+}
+.poster-bottom {
+  display: flex;
+  padding-bottom: constant(safe-area-inset-bottom);
+  /*兼容 IOS<11.2*/
+  padding-bottom: env(safe-area-inset-bottom);
+  /*兼容 IOS>11.2*/
+}
+.bottom-item {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: #FFFFFF;
+  font-size: 28rpx;
+}
+.bottom-item .view {
+  height: 36rpx;
+  margin-top: 16rpx;
+  background-color: #FFFFFF;
+  font-size: 24rpx;
+}
+.bottom-item-text {
+  height: 36rpx;
+  margin-top: 16rpx;
+  font-size: 24rpx;
+}
+.bottom-item_img {
+  width: 100rpx;
+  height: 100rpx;
+  border-radius: 50%;
+}
+.share-btn {
+  width: 100rpx;
+  height: 100rpx;
+  border-radius: 50%;
+  padding: 0;
+}
+.active-poster {
+  border: 2px solid #1472FF;
+}
+.cancel-btn {
+  width: 100%;
+  height: 96rpx;
+  background: #FFFFFF;
+  color: #000000;
+  font-size: 28rpx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  bottom: 68rpx;
+}
+.blank-view {
+  position: absolute;
+  bottom: 0;
+  height: 68rpx;
+  width: 100%;
+  background: #FFFFFF;
+}

package/miniprogram_dist/AliveInvite/LiveRoomVertical/components/rewards/rewards.js

@@ -0,0 +1,117 @@
+// import room from '@/api/room';
+import {
+    getActivityRules
+} from "../../../../common/api/eLiveInvite";
+Component({
+    properties: {
+        inActivity: {
+            type: Boolean,
+            value: false
+        },
+        roomInfo: {
+            type: Object,
+            value: {}
+        },
+        appId: {
+            type: String,
+            value: ""
+        },
+        userId: {
+            type: String,
+            value: ""
+        }
+    },
+    data: {
+        rewardList: [],
+        // 折叠后展示的奖品
+        displayRewardList: [
+            // {
+            //     prize: '一个钻石',
+            //     min: 1,
+            //     max: 1
+            // },
+            // {
+            //     prize: '一个项链',
+            //     min: 2,
+            //     max: 5
+            // },
+            // {
+            //     prize: '一个戒指戒指戒指戒指戒指戒指戒指戒指',
+            //     min: 6,
+            //     max: 10
+            // },
+            // {
+            //     prize: '一个石头石头石头石头石头石头石头石头石头石头',
+            //     min: 11,
+            //     max: 20
+            // }
+        ],
+        isShowRules: false,
+        isShowReward: false,
+        isFold: true // 折叠奖品
+    },
+    ready() {
+        this.getRewardsList();
+    },
+    methods: {
+        getRewardsList() {
+            let params = {
+                bizData: {
+                    resource_id: this.properties.roomInfo.alive_id,
+                    resource_type: 4
+                },
+                user_id: this.properties.userId,
+                app_id: this.properties.appId
+
+            }
+            // let params = {
+            //     bizData: {
+            //         resource_id: "l_61935f8260b219ba0025f301",
+            //         resource_type: 4
+            //     },
+            //     user_id: "u_6119db8f279b3_BLLGPeghc5",
+            //     app_id: "appmzd7lhrj6214"
+
+            // }
+            getActivityRules(params).then(res => {
+                let DATA = res.data;
+                if (DATA.code === 0) {
+                    this.setData({
+                        rewardList: DATA.data.prize_rules,
+                        isShowRules: !!DATA.data.is_show_remark,
+                        isShowReward: !!DATA.data.is_show_prize
+                    })
+                    this.computedDisplayReward(this.data.isFold, this.data.rewardList)
+                } else {
+                    wx.showToast({
+                        title: DATA.msg,
+                        icon: 'error'
+                    })
+                }
+            }).catch(err => {
+                wx.showToast({
+                    title: err.data.msg,
+                    icon: 'error'
+                })
+            })
+        },
+        // 重新计算展示奖品数目
+        computedDisplayReward(ISFOLD, REWARD) {
+            let displayRewardList = ISFOLD ? REWARD.slice(0, 1) : REWARD;
+            this.setData({
+                displayRewardList: displayRewardList
+            })
+        },
+        // 切换折叠效果
+        switchFold() {
+            this.setData({
+                isFold: !this.data.isFold
+            })
+            this.computedDisplayReward(this.data.isFold, this.data.rewardList);
+        },
+        // 向父组件发送事件：打开规则详情弹窗
+        openRuleDetail() {
+            this.triggerEvent('openRuleDetail')
+        }
+    }
+})

package/miniprogram_dist/AliveInvite/LiveRoomVertical/components/rewards/rewards.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

package/miniprogram_dist/AliveInvite/LiveRoomVertical/components/rewards/rewards.wxml

@@ -0,0 +1,36 @@
+<view class="container-rewards">
+    <view class="header">
+      <view class="title"> 冲榜活动 </view>
+      <view class="{{ !inActivity ? 'is-gray status' : 'status' }}">
+        {{ inActivity ? "活动火热进行中" : "活动已结束" }}
+      </view>
+      <view wx:if="{{isShowRules}}" class="link-detail" bindtap="openRuleDetail">
+        规则说明
+        <image
+          class="new-icon-right"
+          src="../../../images/icon_arrow_right_white.png"
+        >
+        </image>
+      </view>
+    </view>
+    <view class="reward-detail" wx:if="{{isShowReward && displayRewardList.length}}">
+      <view class="reward-list">
+        <view
+          wx:for="{{displayRewardList}}"
+          class="reward-item"
+        >
+          <view class="name">{{ item.prize }}</view>
+          <view class="ranking" >
+             {{item.min === item.max ? '第' + item.max + '名获得': '第' + item.min + '-' + item.max + '名获得'}}
+          </view>
+        </view>
+        <view wx:if="{{rewardList.length > 1 }}" bindtap="switchFold" class="link-fold">
+          {{ isFold ? "更多奖品" : "收起" }}
+          <image
+            class="{{ isFold ? 'icon-down': 'icon-up'}}"
+            src="../../../images/icon_arrow_up.png"
+          />
+        </view>
+      </view>
+    </view>
+</view>

package/miniprogram_dist/AliveInvite/LiveRoomVertical/components/rewards/rewards.wxss

@@ -0,0 +1,92 @@
+.container-rewards {
+  font-family: "PingFangSC-Regular", "PingFang SC";
+  position: relative;
+  width: calc(100% - 64rpx);
+  max-width: 760rpx;
+  background: #e7f4ff;
+  border-radius: 8rpx;
+  margin: 0 auto;
+  z-index: 1;
+  margin-bottom: 32rpx;
+  padding: 0 32rpx;
+  box-sizing: border-box;
+}
+.header {
+  display: flex;
+  align-items: center;
+  height: 114rpx;
+}
+.title {
+  font-family: "PingFangSC-Medium", "PingFang SC";
+  font-weight: 500;
+  font-size: 36rpx;
+  background: linear-gradient(90deg, #7b88ff 0%, #7b88ff 30%, #ce7cfd 50%, #fc71cb 100%);
+  -webkit-background-clip: text;
+  color: transparent;
+  margin-right: 8rpx;
+}
+.status {
+  display: inline-flex;
+  align-items: center;
+  height: 45rpx;
+  background-image: linear-gradient(90deg, rgba(255, 50, 149, 0) 0%, #ff9c5c 0%, #ff5cab 53%, #cc5cff 100%);
+  border-radius: 22rpx;
+  color: #ffffff;
+  padding: 0 16rpx;
+  font-size: 24rpx;
+}
+.status.is-gray {
+  background: #999999;
+}
+.link-detail {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  font-size: 24rpx;
+  color: #999999;
+  line-height: 34rpx;
+  cursor: pointer;
+}
+.link-detail .new-icon-right {
+  width: 36rpx;
+  height: 36rpx;
+}
+.reward-detail {
+  padding-bottom: 32rpx;
+}
+.reward-list {
+  font-size: 24rpx;
+  color: #333333;
+  background: #ffffff;
+  border-radius: 8rpx;
+  padding: 24rpx;
+  box-sizing: border-box;
+}
+.reward-item {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 24rpx;
+}
+.reward-item .name {
+  width: 320rpx;
+}
+.reward-item:nth-child(1) {
+  margin-top: 0rpx;
+}
+.link-fold {
+  margin-top: 24rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #999999;
+}
+.icon-up {
+  width: 36rpx;
+  height: 36rpx;
+}
+.icon-down {
+  transform: rotate(180deg);
+  width: 36rpx;
+  height: 36rpx;
+}

package/miniprogram_dist/AliveInvite/LiveRoomVertical/components/rules/rules.js

@@ -0,0 +1,90 @@
+// import room from '@/api/room';
+import {
+    getDetailRules
+} from "../../../../common/api/eLiveInvite";
+Component({
+    properties: {
+        rulesDialogSwitch:{
+            type: Boolean,
+            value:false
+        },
+        aliveId: {
+            type: String,
+            value: ''
+        },
+        appId: {
+            type: String,
+            value: ''
+        },
+        userId: {
+            type: String,
+            value: ''
+        },
+        isPackUp:{
+            type:Boolean,
+            value:false,
+        }
+    },
+    data: {
+        showRewardsRules: false,
+        ruleDetail: '' //规则详情
+    },
+    observers: {
+        rulesDialogSwitch(val) {
+            if(val){
+                this.showRules()
+            }
+        },
+      },
+    // computed 需要引入
+    ready() {
+    },
+    methods: {
+        closeRules() {
+            this.setData({
+                showRewardsRules: false
+            })
+        },
+        showRules() {
+            this.setData({
+                showRewardsRules: true
+            })
+            this.getDetailRules();
+        },
+        getDetailRules() {
+            let params = {
+                bizData: {
+                    alive_id: this.properties.aliveId,
+                },
+                user_id: this.properties.userId,
+                app_id: this.properties.appId
+            }
+            // let params = {
+            //     bizData: {
+            //         alive_id: "l_61935f8260b219ba0025f301",
+            //     },
+            //     user_id: "u_6119db8f279b3_BLLGPeghc5",
+            //     app_id: "appmzd7lhrj6214"
+            // }
+            getDetailRules(params).then(res => {
+                let DATA = res.data;
+                console.log("getDetailRules", DATA);
+                if (DATA.code === 0) {
+                    this.setData({
+                        ruleDetail: DATA.data.text
+                    })
+                } else {
+                    wx.showToast({
+                        title: DATA.msg,
+                        icon: 'error'
+                    })
+                }
+            }).catch(err => {
+                wx.showToast({
+                    title: err.data.msg,
+                    icon: 'error'
+                })
+            });
+        },
+    }
+})

package/miniprogram_dist/AliveInvite/LiveRoomVertical/components/rules/rules.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

package/miniprogram_dist/AliveInvite/LiveRoomVertical/components/rules/rules.wxml

@@ -0,0 +1,16 @@
+<view  class="{{isPackUp?'viewAreaPackUp':'viewUnPackUp'}} container-rules" wx:if="{{showRewardsRules}}">
+  <van-popup show="{{ showRewardsRules }}" bind:close="onClose" position="bottom" custom-class="container-rules">
+    <view>
+        <view bindtap="closeRules" class="header">
+          <image
+            class="icon-left-back"
+            src="../../../images/icon_arrow_up.png"
+          />
+          规则说明
+        </view>
+        <view class="detail">
+          <rich-text  nodes="{{ruleDetail}}"></rich-text>
+        </view>
+    </view>
+</van-popup>
+</view>

package/miniprogram_dist/AliveInvite/LiveRoomVertical/components/rules/rules.wxss

@@ -0,0 +1,48 @@
+@keyframes popping {
+  from {
+    transform: translateY(11.2rpx);
+    opacity: 0.5;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+.container-rules {
+  animation: popping ease 300ms;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  width: 750rpx;
+  height: calc(100vh - 494rpx);
+  background-color: #fff !important;
+  background: url("https://wechatapppro-1252524126.cos.ap-shanghai.myqcloud.com/appgwaqerxu2025/image/b_u_5b2225aa46488_oGKN7IvA/kpzb2l510aau.png?imageView2/2/w/200/q/60");
+  background-size: contain;
+  background-repeat: no-repeat;
+  border-radius: 16rpx 16rpx 0 0;
+}
+.viewAreaPackUp {
+  height: calc(100vh - 160rpx);
+}
+.viewUnPackUp {
+  height: calc(100vh - 494rpx);
+}
+.header {
+  height: 146rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.icon-left-back {
+  position: absolute;
+  left: 20rpx;
+  transform: rotate(270deg);
+  width: 45rpx;
+  height: 45rpx;
+}
+.detail {
+  padding: 0 32rpx;
+  overflow-y: scroll;
+  height: calc(100vh - 700rpx);
+}