.env

@@ -1,5 +1,5 @@
-#TARO_APP_API=https://yjx.dev.yaojiankang.top
-TARO_APP_API=https://mooc.yaojiankang.top
+TARO_APP_API=https://yjx.dev.yaojiankang.top
+#TARO_APP_API=https://mooc.yaojiankang.top
 #TARO_APP_API=https://shopfix.yaojiankang.top
 #TARO_APP_API=https://playedu.yaojiankang.top
 TARO_APP_LGOIN=true

src/api/home.ts

@@ -77,8 +77,5 @@ export const HomeApi = {
   /** 文章播放量 + 1 */
   articleViews(id: string | number) {
     return request(`/home/v1/article/views/${id}`, "POST")
-  },
-  voideView(id: number | string) {
-    return request(`/home/v1/health/set_play/${id}`, "PUT")
   }
 }

src/components/collect/collect.tsx

@@ -18,17 +18,6 @@ interface Props {
   onUpdate?: (v: boolean) => void
 }
 
-const versions = new Map()
-
-const collect = async (scope: string, params: Create, setSelect: (v: boolean) => void, value: boolean) => {
-  const localVersion = (versions.get(scope)  || 0) + 1
-  versions.set(scope, localVersion)
-  await userApi.create(params)
-  if (localVersion === versions.get(scope)) {
-    setSelect(value)
-  }
-}
-
 /** 收藏 */
 const Collect: FC<Props> = (props) => {
   const {token} = Profile.useContainer()
@@ -44,16 +33,12 @@ const Collect: FC<Props> = (props) => {
       Taro.navigateTo({url: '/pages/login/login'})
       return
     }
+    if (loading) return;
     props.onClick?.()
+    await userApi.create({owner_id: props.owner_id, owner_type: props.owner_type})
     setSelect(!select)
     setLoading(true)
-    collect(`${props.owner_id}#${props.owner_type}`, {
-      owner_id: props.owner_id,
-      owner_type: props.owner_type,
-    }, (v) => {
-      setSelect(v)
-      props.onUpdate?.(v)
-    }, !select)
+    props.onUpdate?.(!select)
     setTimeout(() => {
       setLoading(false)
     }, 300)

src/components/custom-page-container/custom-page-container.module.scss

@@ -84,11 +84,11 @@
 
 @keyframes childrenCenter {
   from {
-    transform: scale(0) translateY(calc(-50% - 100px));
+    transform: scale(0);
     padding: 0;
   }
   to {
-    transform: scale(1) translateY(calc(-50% - 100px));
+    transform: scale(1);
     padding: 0 30px;
   }
 }

src/components/custom-page-container/custom-page-container.tsx

@@ -49,9 +49,7 @@ export const PageContainerInner: FC<PageContainerProps> = (props) => {
       case 'center':
         style.width = '90%'
         style.borderRadius = '10px'
-        style.padding = '0 !important'
-        style.top = '50%'
-        // style.transform = 'translateY(-100px) !important'
+        style.padding = '0'
         break
     }
 
@@ -91,14 +89,14 @@ export const PageContainerInner: FC<PageContainerProps> = (props) => {
 
 const CustomPageContainer: FC<PageContainerProps> = (props) => {
   if (props.position === 'center') {
-    return <PageContainerInner {...props} onAfterLeave={props.onClickOverlay}/>
+    return <PageContainerInner {...props} />
   }
   if (process.env.TARO_ENV !== 'h5') {
-    return (<PageContainer {...props} round onAfterLeave={props.onClickOverlay}>
+    return (<PageContainer {...props} round>
       <View className={styles.content} style={{position: 'relative'}}>{props.children}</View>
     </PageContainer>)
   }
-  return (<PageContainerInner {...props} onAfterLeave={props.onClickOverlay}/>);
+  return (<PageContainerInner {...props} />);
 }
 
 export default CustomPageContainer

src/components/textCollapse/collapse.module.scss

@@ -1,4 +1,4 @@
-.expansion {
+.expansion{
   display: inline-block;
   padding: 0 10rpx;
   color: #00d6ac;

src/components/textCollapse/collapse.tsx

@@ -8,43 +8,44 @@ interface Props {
   text: string
 }
 
-const LineEllipsis: FC<Props> = ({text}: Props) => {
+const LineEllipsis:FC<Props> = ({text}:Props) => {
   const [disabled, setDisabled] = useState(false)
   const [isExpansioned, setIsExpansioned] = useState(false)
   const [overflow, setOverflow] = useState(false)
 
-  useEffect(() => {
+  useEffect(()=>{
     init()
-  }, [text])
+  },[text])
 
-  function init() {
+  function init () {
     Taro.nextTick(() => {
       const query = Taro.createSelectorQuery()
       query.select('#Text').boundingClientRect()
       query.exec((res) => {
+        console.log({res})
         const height = res[0].height
-        if (height <= 105) {
+        if(height <= 30) {
           setDisabled(true)
-        } else {
+        }else{
           setOverflow(true)
         }
       })
     })
   }
 
-  function handleExpend(e?: ITouchEvent) {
+  function handleExpend (e?: ITouchEvent) {
     e && e.stopPropagation();
     setOverflow(false)
     setIsExpansioned(true)
   }
 
-  function handleHide(e?: ITouchEvent) {
+  function handleHide (e?: ITouchEvent) {
     e && e.stopPropagation();
     setOverflow(true)
     setIsExpansioned(false)
-  }
+  };
 
-  function toggle() {
+  function toggle () {
     if (disabled) return;
     if (isExpansioned) {
       handleHide();
@@ -53,36 +54,37 @@ const LineEllipsis: FC<Props> = ({text}: Props) => {
     }
   }
 
-  return (
-    <View
-      id="wrap"
-      style={{
-        position: 'relative',
-        color: '#999795',
-        fontSize: '25rpx',
-        overflow: overflow ? 'hidden' : 'unset',
-        height: overflow ? '105rpx' : 'unset',
-        lineHeight: overflow ? '35rpx' : '35rpx',
-        marginTop: '24rpx',
-      }}>
-      <View id='Text' onClick={toggle}>
-        {text}
-        {!overflow && isExpansioned && (
-          <Text className={styles.expansion} onClick={handleHide}>
-            收起
+    return (
+      <View
+        id="wrap"
+        style={{
+          position: 'relative',
+          color: '#999795',
+          fontSize: '25rpx',
+          overflow: overflow ? 'hidden' : 'unset',
+          height: overflow ? '35rpx' : 'unset',
+          lineHeight: overflow ? '35rpx' : '35rpx',
+          marginTop:'24rpx',
+        }}>
+        <View id='Text' onClick={toggle}>
+          {text}
+          {!overflow && isExpansioned && (
+            <Text className={styles.expansion} onClick={handleHide}>
+              收起
+            </Text>
+          )}
+        </View>
+        {overflow && (
+          <Text
+            className={styles.expansion}
+            onClick={handleExpend}
+            style={{position: 'absolute', top: '0', right: '0', background: '#fff'}}>
+            ...展开
           </Text>
         )}
       </View>
-      {overflow && (
-        <Text
-          style={{position: "absolute", top: "70rpx", right: "0", background: "#fff"}}
-          className={styles.expansion}
-          onClick={handleExpend}>
-          . . . 展开
-        </Text>
-      )}
-    </View>
-  )
+    );
+  // }
 }
 
 export default LineEllipsis;

src/components/videoList/videoList.tsx

@@ -2,10 +2,9 @@ import {FC, useEffect, useState} from "react";
 import styles from "@/pages/preview/health/health.module.scss";
 import {Image, Text, View} from "@tarojs/components";
 import Img from "@/components/image/image";
+import play from "@/static/img/play-back.png";
+import {formatDate} from "@/utils/time";
 import Taro from "@tarojs/taro";
-import videoEvent from "@/hooks/videoEvent";
-import palyWhite from '@/static/img/palyWhite.png'
-import starWhite from '@/static/img/starWhite.png'
 
 interface Props {
   data: VideList
@@ -19,19 +18,6 @@ const VideoList: FC<Props> = (props) => {
     setData(props.data)
   }, [props.data])
 
-  useEffect(() => {
-    videoEvent.videoOn(data.id, ({view}) => {
-      setData({
-        ...data,
-        video_view: view
-      })
-    })
-  }, [])
-
-  Taro.useUnload(() => {
-    videoEvent.off(data.id)
-  })
-
   function jump() {
     Taro.preload(data)
     Taro.navigateTo({url: `/pages/preview/videoFull/videoFull?id=${data.id}`})
@@ -40,24 +26,13 @@ const VideoList: FC<Props> = (props) => {
   return (
     <View key={data.id} className={styles.health} onClick={jump}>
       <Img src={data.url_path} mode='widthFix' errorType={props.errorType} height={346}/>
-      <View className='p-2 relative'>
-        <View className='text-ellipsis-1 font-28 text-dark'>{data.title}</View>
-        <View className='text-ellipsis-2 mt-2 font-24 text-secondary'>{data.introduction}</View>
-
-        <View className={styles.info}>
-          <View className='flex'>
-            <View className='flex align-center mr-3'>
-              <Image src={palyWhite}/>
-              <Text>{(data.video_view || 0)}</Text>
-            </View>
-
-            <View className='flex align-center'>
-              <Image src={starWhite}/>
-              <Text>{(data.video_view || 0)}</Text>
-            </View>
-          </View>
-
-          <View>1:00</View>
+      <Image src={play} className={styles.play} mode='aspectFit'/>
+      <View className='p-1'>
+        <View className='text-ellipsis-2  text-dark'>{data.title}</View>
+        <View className='text-ellipsis-2 mt-1 font-26 text-secondary'>{data.introduction}</View>
+        <View className='font-24 text-muted my-2  flex justify-between'>
+          <Text>{formatDate(new Date(data.publish_time), "YY-MM-dd")}</Text>
+          <Text>{(data.video_view || 0)}观看</Text>
         </View>
       </View>
     </View>)

src/hooks/articlesEvent.ts

@@ -1,6 +1,6 @@
 import Taro from "@tarojs/taro";
 
-const KEY = 'ARTICLES_EVENTS'
+const KEY = 'VIDEO_EVENTS'
 
 interface Data {
   id: number

src/hooks/videoEvent.ts

@@ -1,28 +0,0 @@
-import Taro from "@tarojs/taro";
-
-const KEY = 'VIDEO_EVENTS'
-
-interface Data {
-  id: number
-  view: number
-}
-
-function videoAdd(data: Data) {
-  Taro.eventCenter.trigger(KEY + data.id, data)
-}
-
-function videoOn(id: number, fn: (data: Data) => void) {
-  Taro.eventCenter.on(KEY + id, fn)
-}
-
-function off(id: number) {
-  Taro.eventCenter.off(KEY + id)
-}
-
-const VideoEvent = {
-  videoAdd,
-  videoOn,
-  off
-}
-
-export default VideoEvent

src/pages/preview/brand/article/article.module.scss

@@ -46,9 +46,9 @@ page{
   z-index: 99;
   position: fixed;
   bottom: 0;
-  width: 650rpx;
+  width: 690rpx;
   height: 100rpx;
-  padding: 0 50rpx env(safe-area-inset-bottom);
+  padding: 0 30rpx env(safe-area-inset-bottom);
   display: flex;
   justify-content: flex-end;
   align-items: center;

src/pages/preview/brand/article/article.tsx

@@ -88,7 +88,7 @@ const article: FC = () => {
           })
           articlesEvent.recordsAdd({id: Number(id), view: (data?.page_view || 0) + 1})
         })
-      }, 3000))
+      }, 10000))
 
       Taro.setNavigationBarTitle({title: data.title})
       if (data.content.length < 200) {

src/pages/preview/brand/info/info.tsx

@@ -1,6 +1,6 @@
 import {FC, useCallback, useEffect, useState} from "react";
 import {Swiper, SwiperItem, Text, Video, View} from "@tarojs/components";
-import {brandApi, BrandRecord} from "@/api";
+import { brandApi, BrandRecord} from "@/api";
 import styles from './info.module.scss'
 import Taro, {useReachBottom, useRouter} from "@tarojs/taro";
 import LineEllipsis from "@/components/textCollapse/collapse";
@@ -112,7 +112,7 @@ const BrandInfo: FC = () => {
         <View className={styles['top']}>
           <View className='flex justify-between'>
             <Text className={`${styles['title']} flex-1`}>{brandInfo?.name}</Text>
-            <Collect owner_type={4} owner_id={id} select={brandInfo?.collect} styles={{width: 'auto'}}/>
+            <Collect owner_type={4} owner_id={id} select={brandInfo?.collect}/>
           </View>
           <LineEllipsis text={brandInfo?.graphic_introduction || '暂无简介'}/>
         </View>

src/pages/preview/health/health.module.scss

@@ -25,27 +25,3 @@
   right: 20rpx;
   background: transparent !important;
 }
-
-.info {
-  font-size: 24rpx;
-  padding: 0 20rpx;
-  height: 52rpx;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  transform: translateY(-100%);
-  box-sizing: border-box;
-  color: #fff;
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
-
-  Image {
-    width: 24rpx;
-    height: 24rpx;
-    margin-right: 10rpx;
-    vertical-align: inherit;
-  }
-}

src/pages/preview/videoFull/videoFull.tsx

@@ -2,10 +2,9 @@ import {Video, View} from "@tarojs/components";
 import {FC, useState} from "react";
 import Taro from "@tarojs/taro";
 import styles from './videoFull.module.scss'
-import {brandApi, HomeApi} from "@/api";
+import {brandApi} from "@/api";
 import Collect from "@/components/collect/collect";
 import Spin from "@/components/spinner";
-import VideoEvent from "@/hooks/videoEvent";
 
 interface Params {
   id: string
@@ -17,8 +16,6 @@ const VideoFull: FC = () => {
   const [palying, setpalying] = useState(false)
   const [data, setData] = useState<VideList | null>(null)
   const [enable, setEnable] = useState<boolean>(!Taro.getCurrentInstance().preloadData)
-  const [timing, setTiming] = useState<NodeJS.Timeout | undefined>(undefined)
-
 
   Taro.useLoad(() => {
     const preloadData: VideList = Taro.getCurrentInstance().preloadData as VideList
@@ -36,15 +33,6 @@ const VideoFull: FC = () => {
           }
         })
       }
-      setTiming(setTimeout(() => {
-        HomeApi.voideView(Number(id)).then(() => {
-          setData({
-            ...res,
-            video_view: res.video_view + 1
-          })
-          VideoEvent.videoAdd({id: Number(id), view: res.video_view + 1})
-        })
-      }, 3000))
       setData(res)
     }).catch(() => {
       if (!preloadData) {
@@ -62,10 +50,6 @@ const VideoFull: FC = () => {
     })
   })
 
-  Taro.useUnload(() => {
-    clearTimeout(timing)
-  })
-
   function click() {
     if (palying) {
       video.pause()
@@ -112,8 +96,7 @@ const VideoFull: FC = () => {
               <View className='font-36 font-weight flex-1 pr-3 text-row1'>{data.title}</View>
               <Collect owner_id={Number(id)} owner_type={2} styles={{color: '#fff'}} select={data.collects}/>
             </View>
-            <View className='font-32'>播放{data.video_view}</View>
-            <View className='font-32 mt-1 text-ellipsis-1'>{data.introduction}</View>
+            <View className='font-32 mt-1 text-ellipsis-2'>{data.introduction}</View>
           </View>
         </> : <Spin enable={enable} overlay/>
       }