lex 1 year ago
parent
commit
7a5c69a91d

+ 16 - 1
src/components/o-video/index.module.less

@@ -44,6 +44,21 @@
     .tcp-skin .vjs-play-progress {
       background-color: var(--van-primary) !important;
     }
+
+    .vjs-poster {
+      background-size: cover;
+    }
+
+    .video-js .vjs-progress-control:hover .vjs-progress-holder {
+      font-size: inherit !important;
+      outline: none;
+    }
+
+    .video-js .vjs-slider:focus {
+      box-shadow: none !important;
+      text-shadow: none !important;
+      outline: none;
+    }
   }
 
   .video {
@@ -97,4 +112,4 @@
 
 .freeRate {
   color: #32ffd8;
-}
+}

+ 2 - 0
src/views/creation/index.module.less

@@ -8,11 +8,13 @@
 
     .video-js .vjs-progress-control:hover .vjs-progress-holder {
       font-size: inherit !important;
+      outline: none;
     }
 
     .video-js .vjs-slider:focus {
       box-shadow: none !important;
       text-shadow: none !important;
+      outline: none;
     }
   }
 }

+ 2 - 2
src/views/mine-orchestra/index.tsx

@@ -137,8 +137,8 @@ export default defineComponent({
               class={styles.tabs}
               lazyRender={true}
               background="transparent"
-              animated
-              swipeable
+              // animated
+              // swipeable
               lineWidth={16}
               lineHeight={4}
             >

+ 17 - 6
src/views/mine-orchestra/orchestra-deeds/index.tsx

@@ -36,6 +36,7 @@ export default defineComponent({
     const state = reactive({
       isClick: false,
       list: [] as any,
+      videoWidth: '100%',
       listState: {
         reshLoading: false,
         dataShow: true, // 判断是否有数据
@@ -98,10 +99,16 @@ export default defineComponent({
         }
       })
     }
-    onMounted(() => {
-      getList()
-    })
     const swipeRef = ref([] as any)
+    onMounted(async () => {
+      await getList()
+
+      nextTick(() => {
+        // 为了处理在安卓手机上面关闭全屏之后样式会有问题
+        const width = document.querySelector('.van-step__title')?.clientWidth
+        state.videoWidth = width ? width + 'px' : '100%'
+      })
+    })
     return () => (
       // <OFullRefresh
       //   v-model:modelValue={state.listState.refreshing}
@@ -142,10 +149,13 @@ export default defineComponent({
                     </div>
                   </div>
                   <p class={[styles.content, 'van-multi-ellipsis--l2']}>{item.content}</p>
-
-                  <Swipe ref={(el: any) => (swipeRef.value[index] = el)} class={styles.storySwipe}>
+                  <Swipe
+                    ref={(el: any) => (swipeRef.value[index] = el)}
+                    class={styles.storySwipe}
+                    touchable={item.type === 'VIDEO' ? false : true}
+                  >
                     {item.attachments &&
-                      item.attachments.map((child: any) => (
+                      item.attachments.map((child: any, index: number) => (
                         <SwipeItem>
                           {item.type === 'IMAGE' && (
                             <div
@@ -164,6 +174,7 @@ export default defineComponent({
                             <OVideo
                               src={child.url}
                               height={'100%'}
+                              style={{ width: state.videoWidth }}
                               poster={child.coverImage}
                               class={styles.swipeImg}
                               ref={(el: any) => (videoRef.value[index] = el)}