更新

src/views/courseware-list/component/book/index.tsx

@@ -15,17 +15,12 @@ import { useRouter } from 'vue-router';
 import { listenerMessage, postMessage } from '@/helpers/native-message';
 import { showToast } from 'vant';
 import queryString from 'query-string';
-import CoursewareDetail from '@/custom-plugins/guide-page/courseware-detail';
-import { usePageVisibility } from '@vant/use';
-import { setLogin, state } from '@/state';
-import TheNoticeBar from '@/components/the-noticeBar';
+import { state } from '@/state';
 import {
   api_lessonDetailCourseware,
   api_classDetailCourseware
 } from '../../api';
 import SelectCoursewarePop from '@/components/select-courseware-pop';
-import SelectCoursewareMember from '@/components/select-courseware-member';
-import request from '@/helpers/request';
 
 export default defineComponent({
   name: 'the-book',
@@ -53,7 +48,6 @@ export default defineComponent({
   },
   emits: ['close'],
   setup(props, { emit }) {
-    const pageVisibility = usePageVisibility();
     const router = useRouter();
     console.log(state.user.data.phone);
     const lastTimeKey = 'lastTime' + (state?.user?.data?.phone ?? '');
@@ -69,7 +63,6 @@ export default defineComponent({
       coursewareList: [] as any
     });
     const showSelectCourseware = ref(false);
-    const showMember = ref(false);
     const showGuide = ref(false);
     const isend = ref(false);
     const step = ref(0);
@@ -289,17 +282,6 @@ export default defineComponent({
       }
     );
 
-    watch(
-      () => pageVisibility.value,
-      async (val: any) => {
-        if (val === 'visible') {
-          const userCash = await request.get('/edu-app/user/getUserInfo', {
-            initRequest: true // 初始化接口
-          });
-          setLogin(userCash.data);
-        }
-      }
-    );
     // 检测有几个课件
     const checkCourseware = async (item: any) => {
       if (item.id) {
@@ -309,19 +291,6 @@ export default defineComponent({
         }
 
         if (item.coursewareNum) {
-          // needVipLock
-          const schoolInfos = state.user.data?.schoolInfos;
-          const schoolLock =
-            schoolInfos && schoolInfos.length > 0
-              ? schoolInfos[0].needVipLock
-              : true;
-          if (!state?.user?.data.vipMember && schoolLock) {
-            showMember.value = true;
-            return;
-          } else {
-            showMember.value = false;
-          }
-
           try {
             const res =
               props.tab == 'all' || props.tab == 'favorite'
@@ -525,13 +494,6 @@ export default defineComponent({
             }}
             onSelect={item => handleOpenPlay(item)}></SelectCoursewarePop>
         )}
-
-        {showMember.value && (
-          <SelectCoursewareMember
-            onClose={() => {
-              showMember.value = false;
-            }}></SelectCoursewareMember>
-        )}
       </div>
     );
   }

src/views/courseware-play/component/point.module.less

@@ -35,6 +35,7 @@
     width: 0;
     display: none;
   }
+
   // .collapseKnow:nth-of-type(n+2) {
   //   padding-top: 2px !important;
   // }
@@ -48,10 +49,29 @@
   overflow: hidden;
 
   .cover {
+    position: relative;
     height: 102px;
     background: #fff;
     overflow: hidden;
 
+    .iconPayment {
+      position: absolute;
+      right: 0;
+      top: 0;
+      padding: 0 4px;
+      border-radius: 0 3px 0 6px;
+      background: rgba(0, 0, 0, 0.74);
+      opacity: 0.7;
+      font-weight: 500;
+      font-size: 12px;
+      color: #FFFFFF;
+
+      &.VIP {
+        background-color: RGBA(220, 138, 94, 1);
+        opacity: 1;
+      }
+    }
+
     &>img {
       display: block;
       width: 100%;
@@ -67,11 +87,13 @@
     color: #131415;
     line-height: 16px;
     background: #E7F9FF;
+
     .typeImg {
       width: 13px;
       height: 13px;
       margin-right: 4px;
     }
+
     .tag {
       padding: 4px 10px;
       border-radius: 4px;
@@ -84,11 +106,13 @@
       white-space: nowrap;
       flex-shrink: 0;
     }
+
     .tName {
       overflow-x: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
     }
+
     :global {
       .van-icon {
         display: none;
@@ -99,6 +123,7 @@
 
   &.itemActive {
     border: 2px solid var(--van-primary-color);
+
     .title {
       :global {
         .van-icon {
@@ -116,14 +141,17 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
+
   .kjLeft {
     display: flex;
     align-items: center;
     overflow-x: hidden;
+
     img {
       width: 13px;
       height: 17px;
     }
+
     span {
       flex: 1;
       overflow-x: hidden;
@@ -135,6 +163,7 @@
       margin: 4px 4px 4px 6px;
     }
   }
+
   .kjRight {
     width: 24px;
     height: 24px;
@@ -150,6 +179,7 @@
   .collapseKnow {
     padding: 8px 12px 6px 12px;
     position: relative;
+
     :global {
       .van-cell {
         margin-bottom: 8px;
@@ -159,6 +189,7 @@
       }
     }
   }
+
   :global {
     .van-cell {
       background: transparent;
@@ -195,6 +226,7 @@
   .firstArrow {
     margin-top: 3px;
   }
+
   .itemImage {
     width: 15px;
     height: 15px;
@@ -214,6 +246,7 @@
       }
     }
   }
+
   .activeItem2 {
     background: #F5F6FA;
     border-radius: 9px;
@@ -225,6 +258,7 @@
       }
     }
   }
+
   .itemActive {
     font-weight: 500;
 

src/views/courseware-play/component/points.tsx

@@ -194,6 +194,15 @@ export default defineComponent({
                               });
                             }}>
                             <div class={styles.cover}>
+                              <span
+                                class={[
+                                  styles.iconPayment,
+                                  styles[material.paymentType]
+                                ]}>
+                                {material.paymentType === 'VIP'
+                                  ? 'VIP'
+                                  : '免费'}
+                              </span>
                               <img src={material.url} />
                             </div>
                             <div class={styles.title}>

src/views/courseware-play/index.tsx

@@ -27,6 +27,8 @@ import iconDian from './image/icon-dian.svg';
 import iconPoint from './image/icon-point.svg';
 import iconUp from './image/icon-up.svg';
 import iconDown from './image/icon-down.svg';
+import selectIcon from './image/select_btn.png';
+import memberLockBg from './image/member_lock_bg.png';
 import Points from './component/points';
 import { browser, getSecondRPM } from '@/helpers/utils';
 import { Vue3Lottie } from 'vue3-lottie';
@@ -1170,6 +1172,10 @@ export default defineComponent({
                       }
                       activeData.nowTime = Date.now();
                     }}>
+                    <div class={styles.memberLock}>
+                      <img />
+                      <img />
+                    </div>
                     {m.type === 'IMG' && <img src={m.content} />}
                     {m.type === 'PPT' && (
                       <iframe