会员逻辑

src/page-instrument/api.ts

@@ -49,7 +49,8 @@ export const studentQueryUserInfo = async () => {
         clientType:"STUDENT",
         id:data.id,
         vipMember: true, // 管乐迷 会员现在在外面判断的 所以这里默认不开启会员验证
-        gender:""
+        gender:"",
+        membershipEndTime: data.membershipEndTime
       }
       return res
     }

src/page-instrument/component/the-music-list/index.tsx

@@ -6,7 +6,7 @@ import { followData } from "/src/view/follow-practice";
 import state, {IPlatform} from "/src/state";
 import { evaluatingData } from "/src/view/evaluating";
 import { getQuery } from "/src/utils/queryString";
-
+import Vip from "../vip"
 const query: any = getQuery();
 export const isMusicList = computed(()=>{
 	return !(query.workRecord || query.modelType || state.platform === IPlatform.PC || query.isCbs)
@@ -17,6 +17,7 @@ export default defineComponent({
 	setup() {
 		return () => (
 			<>
+				<Vip></Vip>
 				<Popup class={styles.popup} position="left" v-model:show={musicListShow.value} round overlay-style={{background:'rgba(0, 0, 0, 0.7)'}}>
 					<div class={[styles.tabs]}>
 						<Tabs>

src/page-instrument/component/the-music-list/list.tsx

@@ -9,6 +9,9 @@ import searImg from "./imgs/searImg.png"
 import huoimg from "./imgs/huo.png"
 import emptyImg from "./imgs/empty.png"
 import { getQuery } from "/src/utils/queryString";
+import dayjs from "dayjs";
+import { storeData } from "/src/store"
+import { vipShow } from "../vip"
 
 export default defineComponent({
   name: "TheMusicList-list",
@@ -74,6 +77,14 @@ export default defineComponent({
     });
 
     const openAccomapina = (item: any) => {
+      if(item.paymentType === "VIP" && state.systemType === "student" && !dayjs().isBefore(dayjs(storeData.user?.membershipEndTime))){
+        vipShow.value = true
+        return
+      }
+      if(item.paymentType === "VIP" && state.systemType === "web" && state.isSchool){
+        vipShow.value = true
+        return
+      }
       if (item.id === state.examSongId) return;
       // 暂停播放
       togglePlay("paused");

src/page-instrument/component/vip/index.module.less

@@ -0,0 +1,27 @@
+.vip{
+  padding: 20px 30px;
+  padding-top: 30px;
+  min-width: 230px;
+  >img{
+    width: 161px;
+    margin: 0 auto 20px;
+    display: block;
+  }
+  >p{
+    margin: 0;
+    font-size: 14px;
+    color: #808080;
+    margin: 0 auto 20px;
+    text-align: center;
+  }
+  .btn{
+    font-size: 16px;
+    height: 40px;
+    line-height: 40px;
+    width: 100%;
+  }
+  &+i{
+    right: 10px;
+    top: 10px;
+  }
+}

src/page-instrument/component/vip/index.tsx

@@ -0,0 +1,39 @@
+import { defineComponent, ref } from "vue";
+import { Button, Popup } from "vant";
+import state from "/src/state";
+import TipsIcon from "./tips.png";
+import styles from "./index.module.less";
+
+export const vipShow = ref(false)
+export default defineComponent({
+  name: "vip-popup",
+  data() {
+    return {
+      content: "您尚未开通云练习服务，请联系乐团老师开通",
+    };
+  },
+  methods: {
+    open() {
+      vipShow.value = false;
+    },
+    getContent() {
+      if (state.isSchool) {
+        this.content = "VIP曲目暂不可用";
+      }
+      return this.content;
+    },
+  },
+  render() {
+    return (
+      <Popup show={vipShow.value} get-container="body" closeable onClickCloseIcon={() => (vipShow.value = false)} round>
+        <div class={styles.vip}>
+          <img src={TipsIcon} />
+          <p>{this.getContent()}</p>
+          <Button class={styles.btn} onClick={this.open} round color="#01C1B5">
+            确定
+          </Button>
+        </div>
+      </Popup>
+    );
+  },
+});