From 358c3ee95c503a6e792371080c452bc4dfb3de9f Mon Sep 17 00:00:00 2001 From: king <2229249788@qq.com> Date: Tue, 12 Sep 2023 18:10:09 +0800 Subject: [PATCH] =?UTF-8?q?=E8=A7=86=E9=A2=91=E6=92=AD=E6=94=BE=E9=87=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env | 4 +-- src/api/home.ts | 3 +++ src/components/videoList/videoList.tsx | 14 +++++++++++ src/hooks/articlesEvent.ts | 2 +- src/hooks/videoEvent.ts | 28 +++++++++++++++++++++ src/pages/preview/brand/article/article.tsx | 2 +- src/pages/preview/videoFull/videoFull.tsx | 21 ++++++++++++++-- 7 files changed, 68 insertions(+), 6 deletions(-) create mode 100644 src/hooks/videoEvent.ts diff --git a/.env b/.env index 3852d45..86e2b46 100644 --- a/.env +++ b/.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 diff --git a/src/api/home.ts b/src/api/home.ts index 0e0ce18..60c85d8 100644 --- a/src/api/home.ts +++ b/src/api/home.ts @@ -77,5 +77,8 @@ 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") } } diff --git a/src/components/videoList/videoList.tsx b/src/components/videoList/videoList.tsx index 8a19b30..cf0d7d9 100644 --- a/src/components/videoList/videoList.tsx +++ b/src/components/videoList/videoList.tsx @@ -5,6 +5,7 @@ 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"; interface Props { data: VideList @@ -18,6 +19,19 @@ const VideoList: FC = (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}`}) diff --git a/src/hooks/articlesEvent.ts b/src/hooks/articlesEvent.ts index d496759..adefd04 100644 --- a/src/hooks/articlesEvent.ts +++ b/src/hooks/articlesEvent.ts @@ -1,6 +1,6 @@ import Taro from "@tarojs/taro"; -const KEY = 'VIDEO_EVENTS' +const KEY = 'ARTICLES_EVENTS' interface Data { id: number diff --git a/src/hooks/videoEvent.ts b/src/hooks/videoEvent.ts new file mode 100644 index 0000000..3895190 --- /dev/null +++ b/src/hooks/videoEvent.ts @@ -0,0 +1,28 @@ +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 diff --git a/src/pages/preview/brand/article/article.tsx b/src/pages/preview/brand/article/article.tsx index a6543c1..aa07995 100644 --- a/src/pages/preview/brand/article/article.tsx +++ b/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}) }) - }, 10000)) + }, 3000)) Taro.setNavigationBarTitle({title: data.title}) if (data.content.length < 200) { diff --git a/src/pages/preview/videoFull/videoFull.tsx b/src/pages/preview/videoFull/videoFull.tsx index 2349c9c..8fa6846 100644 --- a/src/pages/preview/videoFull/videoFull.tsx +++ b/src/pages/preview/videoFull/videoFull.tsx @@ -2,9 +2,10 @@ import {Video, View} from "@tarojs/components"; import {FC, useState} from "react"; import Taro from "@tarojs/taro"; import styles from './videoFull.module.scss' -import {brandApi} from "@/api"; +import {brandApi, HomeApi} from "@/api"; import Collect from "@/components/collect/collect"; import Spin from "@/components/spinner"; +import VideoEvent from "@/hooks/videoEvent"; interface Params { id: string @@ -16,6 +17,8 @@ const VideoFull: FC = () => { const [palying, setpalying] = useState(false) const [data, setData] = useState(null) const [enable, setEnable] = useState(!Taro.getCurrentInstance().preloadData) + const [timing, setTiming] = useState(undefined) + Taro.useLoad(() => { const preloadData: VideList = Taro.getCurrentInstance().preloadData as VideList @@ -33,6 +36,15 @@ 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) { @@ -50,6 +62,10 @@ const VideoFull: FC = () => { }) }) + Taro.useUnload(() => { + clearTimeout(timing) + }) + function click() { if (palying) { video.pause() @@ -96,7 +112,8 @@ const VideoFull: FC = () => { {data.title} - {data.introduction} + 播放{data.video_view} + {data.introduction} : }