From 7a340765585d1ea13bbeb1a71ea4613f22aac3cb Mon Sep 17 00:00:00 2001 From: yujialong <479214531@qq.com> Date: Mon, 4 Nov 2024 11:14:22 +0800 Subject: [PATCH] fix --- src/components/goToMemberModal/index.less | 66 ++++++++++++++++++++ src/components/goToMemberModal/index.tsx | 76 +++++++++++++++++++++++ src/pages/ListenDetail/index.tsx | 46 +++++++++----- src/pages/Vip/index.tsx | 9 --- 4 files changed, 171 insertions(+), 26 deletions(-) create mode 100644 src/components/goToMemberModal/index.less create mode 100644 src/components/goToMemberModal/index.tsx diff --git a/src/components/goToMemberModal/index.less b/src/components/goToMemberModal/index.less new file mode 100644 index 0000000..6e568d6 --- /dev/null +++ b/src/components/goToMemberModal/index.less @@ -0,0 +1,66 @@ +.store_modal { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 17rem; + background: #fff; + border-radius: 1rem; + display: flex; + flex-direction: column; + padding: 0 .5rem .8rem; + z-index: 1000; + + .store_modal_close { + width: 1.5rem; + height: 1.5rem; + margin: 1rem 1rem auto auto; + background-image: url(https://oss.jm-kid.com/wx_5colorflower/close.png); + background-repeat: no-repeat; + background-size: cover; + } + + .store_modal_title { + font-size: 1rem; + font-weight: 600; + text-align: center; + } + + .store_modal_context { + font-size: .875rem; + font-weight: 600; + text-align: center; + margin: .5rem 0 .8rem; + } + + .store_modal_container { + + width: 10rem; + height: 2rem; + display: flex; + flex-direction: row; + background: #07c160; + border-radius: 1rem; + margin: auto; + gap: 1rem; + + .store_modal_title { + font-size: 1rem; + font-weight: 600; + height: 1.125rem; + color: #fff; + text-align: center; + margin: auto; + } + } +} + +.store_overlay { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.5); + z-index: 999; +} diff --git a/src/components/goToMemberModal/index.tsx b/src/components/goToMemberModal/index.tsx new file mode 100644 index 0000000..f73e4ff --- /dev/null +++ b/src/components/goToMemberModal/index.tsx @@ -0,0 +1,76 @@ +import { View, Text } from '@tarojs/components' +import { useState } from 'react'; +import Taro from '@tarojs/taro'; +import './index.less' + + +export default function GoToStoreModal({ visible, onClose, type}) { + + //管理关闭动画状态 + const [isAnimationOpen, setisAnimationOpen] = useState(false) + + if(!visible){ + return null + } + + const handleOverlayClick = (event: any) => { + // 点击蒙层时关闭弹窗 + setisAnimationOpen(true) + setTimeout(() =>{ + setisAnimationOpen(false) + onClose(); + }, 0) + }; + + const handleNavigateToMiniProgram = () => { + Taro.navigateToMiniProgram({ + appId: 'wxbd3d383851fea776', + path: '', + success: (res) => { + console.log('打开成功=>',res) + }, + fail: (res) => { + console.log('打开失败=>',res) + } + }) + + handleOverlayClick(null) + } + + return ( + <> + + + + 专辑播放 + + 你的会员{type === -1 ? '已过期' : '未开通'}，请前往商城购买VIP会员解锁全部专辑 + + + + 去选购 + + + + + + ) +} diff --git a/src/pages/ListenDetail/index.tsx b/src/pages/ListenDetail/index.tsx index c808b47..1f0e4e0 100644 --- a/src/pages/ListenDetail/index.tsx +++ b/src/pages/ListenDetail/index.tsx @@ -3,7 +3,7 @@ import React, { useEffect, useState } from 'react' import Taro, { useLoad } from '@tarojs/taro' import './index.less' import GetPhoneNumber from '../../components/getPhoneModal' -import GoToStoreModal from '../../components/goToStoreModal' +import GoToMemberModal from '../../components/goToMemberModal' interface DetailProps { IsFree: boolean @@ -60,12 +60,12 @@ export default function ListenDetail() { const [isToStoreOpen, setisToStoreOpen] = useState(false) - //管理跳转页面路径 - const [prdtMallLink, setprdtMallLink] = useState('') - //记录prdtId const [queryId, setqueryId] = useState('') + //会员开通状态 + const [memberState, setMemberState] = useState(0) + useLoad((query) => { setqueryId(query.prdtId) if(!isGetUsePhone){ @@ -100,23 +100,20 @@ export default function ListenDetail() { return `${formattedMinutes}:${formattedSeconds}`; } - const handleDisplay = (prdtId: number, resId: number, IsSubscribed: number) => { + const handleDisplay = (prdtId: number, resId: number) => { if(!Taro.getStorageSync('UserToken')){ setisLoginOpen(true) }else{ - console.log('IsSubscribed=>', IsSubscribed) - if (IsSubscribed === -1) { - //未订阅，跳转商城 - setprdtMallLink(detailData.MallLink || '') + console.log('IsSubscribed=>', memberState) + if (memberState !== 1) { + //没有会员，跳转商城 setisToStoreOpen(true) }else{ Taro.navigateTo({ url: '/pages/ListenDisplay/index?prdtId=' + prdtId + '&resId=' + resId }) } - } - } useEffect(()=> { @@ -138,6 +135,23 @@ export default function ListenDetail() { setdetailData(res.data.data) } }) + + Taro.request({ + url: 'https://interapi.jm-kid.com/api/member/data', + method: 'POST', + header: { + authorization: `bearer ${Taro.getStorageSync('UserToken')}` + }, + data: { + timestamp: Date.now(), + member_type: 'audio' + }, + success: (res: any) => { + if(res.data.state === 200){ + setMemberState(res.data.data.main.SubscribedState) + } + }, + }) } }, [isGetUsePhone, queryId]) @@ -205,7 +219,7 @@ export default function ListenDetail() { {handleDisplay( detailData.Product.PrdtId ,item.ResId, detailData.IsSubscribed)}} + onClick={() => {handleDisplay( detailData.Product.PrdtId ,item.ResId)}} > {item.ResTitle} @@ -234,13 +248,11 @@ export default function ListenDetail() { onModalClose={() => setisLoginOpen(false)} > - setisToStoreOpen(false)} - type={0} - mallLink={prdtMallLink} - setmallLink={setprdtMallLink} - > + type={memberState} + > ) } diff --git a/src/pages/Vip/index.tsx b/src/pages/Vip/index.tsx index a6f4af1..360804b 100644 --- a/src/pages/Vip/index.tsx +++ b/src/pages/Vip/index.tsx @@ -21,11 +21,6 @@ export default function Share() { // 开通记录 const [records, setRecords] = useState() - const handleShare = () => { - - } - - useLoad(()=> { setuserAvator(Taro.getStorageSync('UserAvatar')) setuserNickName(Taro.getStorageSync('UserNickName')) @@ -43,14 +38,10 @@ export default function Share() { success: (res: any) => { if(res.data.state === 200){ const { list, main } = res.data.data - console.log(11, list,records) setRecords(list) main && setInfo(main) } }, - fail: (err: any) => { - console.log('兑换失败=>', err) - } }) })