实验分组信息

src/app.config.ts

@@ -16,6 +16,13 @@ export default defineAppConfig({
             "pages": [
                 "complaining/index"
             ]
+        },
+        {
+            "root": "subPackages/my",
+            "pages": [
+                "edit/edit",
+                "edit/editUpload"
+            ]
         }
     ],
 

src/app.ts → src/app.tsx

@@ -2,14 +2,19 @@ import { PropsWithChildren } from 'react'
 import Taro, { useDidHide, useDidShow, useLaunch } from '@tarojs/taro'
 import { globalApp } from '@/class/GlobalContext'
 import {
-    isEasyMode, createSessionId, formatQuery, formatDate
+    isEasyMode, createSessionId, formatQuery, formatDate, getOption
 } from '@/utils'
 import useHotLaunch from '@/hooks/useHotLaunch'
 import http from '@/http/index'
 import {
-    getWxUserInfoByCode, getAbtestConfig, getPositionInfo,
+    getWxUserInfoByCode, getAbtestConfig,
     generateMidv2, getUserFrontConfig
 } from '@/http/api'
+import { userActivie } from '@/logger/userActivieLog'
+import { eventId } from '@/logger/const'
+import { Provider } from 'react-redux'
+import store from './store'
+
 
 import './app.less'
 
@@ -22,9 +27,6 @@ function App({ children }: PropsWithChildren<any>) {
         // create session id
         updateSession()
 
-        // system info
-        updateSystem()
-
         updateGlobal(launch)
 
         // // network change
@@ -34,18 +36,22 @@ function App({ children }: PropsWithChildren<any>) {
         await updateUserInfo()
 
         // mid
-        // const mid = await requestMid()
+        const mid = await requestMid()
+
+        Taro.$global.set('mid', mid)
+        Taro.setStorageSync('mid', mid)
 
-        // Taro.$global.set('mid', mid)
-        // Taro.setStorageSync('mid', mid)
+        //
+        getAccountInfoInApp()
 
-        // getAccountInfoInApp()
+        // system info
+        updateSystem()
     })
 
 
     useDidShow((options) => {
-        // updateAbGroup()
-        // reportUserActiveLog(options)
+        updateAbGroup()
+        reportUserActiveLog(options)
         // onEnvByShake()
     })
 
@@ -56,7 +62,7 @@ function App({ children }: PropsWithChildren<any>) {
             .cleanLoop()
             .cleanStack()
 
-    
+
         const id = createSessionId()
         Taro.$global.set('subSessionId', id)
     })
@@ -73,7 +79,11 @@ function App({ children }: PropsWithChildren<any>) {
         // reportShareVideo()
     })
     // children 是将要会渲染的页面
-    return children
+    return (
+        <Provider store={store} >
+            {children}
+        </Provider>
+    )
 }
 
 function updateGlobal(launch) {
@@ -84,11 +94,46 @@ function updateGlobal(launch) {
 
     // 三十天有无回流
     Taro.$global.set('isReturningUser', !!Taro.getStorageSync('$RETURNING'))
+}
+
+// 启动埋点上报
+function reportUserActiveLog(options) {
+    const launchOption = Taro.$global.get('launchOption')
 
-    // 上报
-    // fetchPositionInfo()
+    options = getOption(options)
+
+    const { scene = -1, hotScene } = launchOption
+
+    if (scene === 1154)
+        options.pageSource = options.pageSource || options.path + '-wxTimeline'
+
+    userActivie(eventId.userActiveAction, {
+        option: JSON.stringify(options),
+        senceType: scene,
+        hotLaunchSceneType: hotScene,
+        activeDate: formatDate(new Date(), 'yyyy-MM-dd'),
+        activeTimestamp: new Date().getTime(),
+        businessType: 'path'
+    })
 }
 
+function updateAbGroup() {
+    Taro.$abGroupInstance
+        .listen(fetchAbtestConfig)
+        .loop()
+        .emit()
+}
+// ab 实验信息
+function fetchAbtestConfig() {
+    http.post(getAbtestConfig).then((res: RequestType) => {
+        const { data, code } = res
+        if (code !== 0)
+            return
+
+        Taro.$abGroupInstance.storeGroup(data)
+        // Taro.setStorageSync('$EXPERIMENT_CONFIG', data)
+    })
+}
 // system
 function updateSystem() {
     const systemInfo = Taro.getSystemInfoSync()
@@ -125,12 +170,53 @@ async function updateUserInfo() {
             console.log(err)
         })
 }
-// session
+
+// sessionid 更新
 function updateSession() {
     const id = createSessionId()
     Taro.$global.set('sessionId', id)
     Taro.$global.set('subSessionId', id)
 }
 
+async function requestMid() {
+    const mid = Taro.getStorageSync('mid')
+
+    if (mid)
+        return mid
+
+    return Taro.loginSync()
+        .then((res: Taro.login.SuccessCallbackResult) => {
+            const { code } = res
+            return http.post(generateMidv2, { code })
+        }).then((res: RequestType) => {
+            const { code, data } = res
+
+            if (code !== 0)
+                return
+
+            return data
+        }).catch(err => {
+            console.log(err)
+        })
+}
+
+// 30天无回流
+function getAccountInfoInApp() {
+    http.post(getUserFrontConfig).then((res: RequestType) => {
+        const { code, data } = res
+        if (code !== 0)
+            return
+
+        const { has30DayReturnCnt } = data
+        // 用户在小程序内的各种属性状态
+        Taro.$global.set('accountInApp', data)
+
+        // 30天有无回流
+        Taro.setStorageSync('$RETURNING', has30DayReturnCnt === 1)
+        Taro.$global.set('isReturningUser', has30DayReturnCnt === 1)
+
+    }).catch(err => {
+    })
+}
 
 export default App

src/class/AbGroupContext.ts

@@ -1,98 +1,114 @@
 import Taro from '@tarojs/taro'
+import { json } from 'stream/consumers'
 
-export const WX_AB_GROUP = { ab_test010: 'ab100'}
+export const WX_AB_GROUP = { ab_test010: 'ab100' }
 for (let i = 1; i < 10; i++)
-  WX_AB_GROUP[`ab_test00${i}`] = 'ab100'
+    WX_AB_GROUP[`ab_test00${i}`] = 'ab100'
 
 class AbGroupContext implements AbGroupContextType {
-  #group: object = WX_AB_GROUP
-  #evtStack: Array<Function> = []
-  #timer: NodeJS.Timeout | null
-  #groupMap = new Map()
-
-  constructor() {
-    this.#group = {
-      ...this.#group,
-      ...Taro.getExptInfoSync()
+    #group: object = WX_AB_GROUP
+    #evtStack: Array<Function> = []
+    #timer: NodeJS.Timeout | null
+    #groupMap = new Map()
+
+    constructor() {
+        this.#group = {
+            ...this.#group,
+            ...Taro.getExptInfoSync()
+        }
+        this.#groupMap = this.objToMap(Taro.getStorageSync('$EXPERIMENT_CONFIG'))
     }
-  }
 
-  listen(evt) {
-    if (typeof evt !== 'function')
-      return this
+    listen(evt) {
+        if (typeof evt !== 'function')
+            return this
 
-    this.#evtStack.push(evt)
+        this.#evtStack.push(evt)
 
-    return this
-  }
+        return this
+    }
+
+    emit() {
+        this.#evtStack.forEach(evt => evt())
 
-  emit() {
-    this.#evtStack.forEach(evt => evt())
+        return this
+    }
 
-    return this
-  }
+    loop(time: number = 60000) {
+        if (this.#timer)
+            return this
 
-  loop(time: number = 60000) {
-    if (this.#timer)
-      return this
+        this.#timer = setInterval(() => {
+            this.emit()
+        }, time)
 
-    this.#timer = setInterval(() => {
-      this.emit()
-    }, time)
+        return this
+
+    }
 
-    return this
+    cleanLoop() {
+        if (this.#timer)
+            clearInterval(this.#timer)
 
-  }
+        return this
+    }
+
+    cleanStack() {
+        this.#evtStack = []
+
+        return this
+    }
 
-  cleanLoop() {
-    if (this.#timer) 
-      clearInterval(this.#timer)
+    get() {
+        return this.#group
+    }
 
-    return this
-  }
+    storeGroup(config) {
+        let abInfos = {}
+        Object.keys(config).forEach(level => {
+            let group = this.#group[level]
+            const abGroupConfigArray = config[level][group] || []
+            abGroupConfigArray.map(item => {
+                try {
+                    item.configValue = JSON.parse(item.configValue)
+                } catch (error) {
+                    item.configValue = {}
+                }
+                return item
+            })
+            abInfos[level] = abGroupConfigArray
+        })
 
-  cleanStack() {
-    this.#evtStack = []
+        this.#groupMap = this.objToMap(abInfos)
+        Taro.setStorageSync('$EXPERIMENT_CONFIG', abInfos)
+    }
 
-    return this
-  }
+    objToMap(obj) {
+        let map = new Map()
+        Object.keys(obj).forEach(level => {
+            let abExpInfos = obj[level]
+            abExpInfos.forEach(abExpInfo => {
+                map.set(abExpInfo.abExpCode, {
+                    level: level,
+                    group: this.#group[level],
+                    abExpCode: abExpInfo.abExpCode,
+                    config: abExpInfo.configValue
+                })
 
-  get() {
-    return this.#group
-  }
+            });
 
-  storeGroup(config) {
-    Object.keys(config).forEach(level => {
-      const abGroupConfigArray = config[level][this.#group[level]] || []
-      abGroupConfigArray.forEach(item => {
-        this.#groupMap.set(item.abExpCode, {
-          level: level,
-          group: this.#group[level],
-          experiment: item.abExpCode,
-          config: item.configValue
         })
-      })
-    })
-
-    this.setStorage(config)
-  }
-
-  validExperiment(name) {
-    return this.#groupMap.has(name + '')
-  }
-
-  getExperimentConfigByName(name) {
-    return this.#groupMap.get(name + '')
-  }
-
-  setStorage(config) {
-    const EXPERIMENT_CONFIG = {}
-    Object.keys(config).forEach(level => {
-      const abGroupConfigArray = config[level][this.#group[level]] || []
-      EXPERIMENT_CONFIG[level] = abGroupConfigArray
-    })
-    Taro.setStorageSync('$EXPERIMENT_CONFIG', EXPERIMENT_CONFIG)
-  }
+        return map
+
+    }
+
+    validExperiment(name) {
+        return this.#groupMap.has(name + '')
+    }
+
+    getExperimentConfigByName(name) {
+        return this.#groupMap.get(name + '')
+    }
 
 }
 

src/class/GlobalContext.ts

@@ -5,65 +5,65 @@ import http from '@/http/index'
 // import { changeLocalEnv } from '@/env'
 
 class GlobalContext {
-  private context = {}
+    private context = {}
 
-  constructor() {}
+    constructor() { }
 
-  get(key) {
-    return this.context[key]
-  }
+    get(key) {
+        return this.context[key]
+    }
 
-  set(key, val) {
-    return this.context[key] = val
-  }
+    set(key, val) {
+        return this.context[key] = val
+    }
 
-  watch() {}
+    watch() { }
 
-  dispatch() {}
+    dispatch() { }
 }
 
 export default GlobalContext
 
 export function globalApp() {
-  if (Taro.$app)
-    return Taro.$app
+    if (Taro.$app)
+        return Taro.$app
 
-  const originGetApp = Taro.getApp
+    const originGetApp = Taro.getApp
 
-  Taro.getApp = function (...options) {
-    const app = originGetApp.apply(Taro, options)
-    app.$global = Object.freeze(new GlobalContext())
-    // app.$changeEnv = changeLocalEnv
+    Taro.getApp = function (...options) {
+        const app = originGetApp.apply(Taro, options)
+        app.$global = Object.freeze(new GlobalContext())
+        // app.$changeEnv = changeLocalEnv
 
-    return new Proxy(app, {
-      get(target, key) {
-        if (target[key] != null)
-          return target[key]
+        return new Proxy(app, {
+            get(target, key) {
+                if (target[key] != null)
+                    return target[key]
 
-        return target.$global[key]
-      },
-      set() {
-        return false
-      }
-    })
-  }
+                return target.$global[key]
+            },
+            set() {
+                return false
+            }
+        })
+    }
 
-  Taro.$app = Taro.getApp()
-  Taro.$global = Taro.$app.$global
-  Taro.$http = http
-  Taro.$abGroupInstance = new AbGroupContext()
-  Taro.$wx = wx
-  Taro.$network = network
-  Taro.loginSync = loginSync
-  
-  return Taro.$app
+    Taro.$app = Taro.getApp()
+    Taro.$global = Taro.$app.$global
+    Taro.$http = http
+    Taro.$abGroupInstance = new AbGroupContext()
+    Taro.$wx = wx
+    Taro.$network = network
+    Taro.loginSync = loginSync
+
+    return Taro.$app
 }
 
 function loginSync(): Promise<TaroGeneral.CallbackResult> {
-  return new Promise((success, fail) => {
-    Taro.login({
-      success,
-      fail
+    return new Promise((success, fail) => {
+        Taro.login({
+            success,
+            fail
+        })
     })
-  })
 }

src/class/Network.ts

@@ -1,41 +1,41 @@
 import Taro from '@tarojs/taro'
 
 class NetWork {
-  #listenStack: Array<Function> = []
-  networkType = 'none'
-
-  constructor() {
-    Taro.onNetworkStatusChange(res => {
-      this.#listenStack.forEach(evt => evt(res))
-    })
-
-    this.getNetworkType().then((res: Taro.getNetworkType.SuccessCallbackResult) => {
-      const { networkType } = res
-      this.networkType = networkType
-    })
-
-    this.listen((res: Taro.onNetworkStatusChange.CallbackResult) => {
-      const { networkType } = res
-      this.networkType = networkType
-    })
-
-  }
-
-  listen(evt) {
-    if (typeof evt !== 'function')
-      return
-
-    this.#listenStack.push(evt)
-  }
-
-  getNetworkType() {
-    return new Promise((success, fail) => {
-      Taro.getNetworkType({
-        success,
-        fail
-      })
-    })
-  }
+    #listenStack: Array<Function> = []
+    networkType = 'none'
+
+    constructor() {
+        Taro.onNetworkStatusChange(res => {
+            this.#listenStack.forEach(evt => evt(res))
+        })
+
+        this.getNetworkType().then((res: Taro.getNetworkType.SuccessCallbackResult) => {
+            const { networkType } = res
+            this.networkType = networkType
+        })
+
+        this.listen((res: Taro.onNetworkStatusChange.CallbackResult) => {
+            const { networkType } = res
+            this.networkType = networkType
+        })
+
+    }
+
+    listen(evt) {
+        if (typeof evt !== 'function')
+            return
+
+        this.#listenStack.push(evt)
+    }
+
+    getNetworkType() {
+        return new Promise((success, fail) => {
+            Taro.getNetworkType({
+                success,
+                fail
+            })
+        })
+    }
 }
 
 

src/class/Route.ts

@@ -2,29 +2,29 @@ import Taro from '@tarojs/taro'
 import { type, stringify } from '@/utils'
 
 export default class Route {
-  pageStacks
-  page
-  path
+    pageStacks
+    page
+    path
 
-  constructor() {
-    this.pageStacks = Taro.getCurrentPages() || []
-    this.page = this.pageStacks[this.pageStacks.length - 1]
-    this.path = this.page?.route || ''
-  }
+    constructor() {
+        this.pageStacks = Taro.getCurrentPages() || []
+        this.page = this.pageStacks[this.pageStacks.length - 1]
+        this.path = this.page?.route || ''
+    }
+
+    push(obj) {
+        if (obj == null)
+            return
 
-  push(obj) {
-    if (obj == null)
-      return
-    
-    if (type(obj, 'String')) {
-      Taro.navigateTo({
-        url: obj
-      })
-    } else if (type(obj, 'Object')) {
-      const { url, query } = obj
-      Taro.navigateTo({
-        url: `${url}?${stringify(query)}`
-      })
+        if (type(obj, 'String')) {
+            Taro.navigateTo({
+                url: obj
+            })
+        } else if (type(obj, 'Object')) {
+            const { url, query } = obj
+            Taro.navigateTo({
+                url: `${url}?${stringify(query)}`
+            })
+        }
     }
-  }
 }

src/class/WorkletContext.ts

@@ -1,7 +1,7 @@
 class WorkletContext {
-  runOnUI() {}
-  runOnJS() {}
-  shared() {}
+    runOnUI() { }
+    runOnJS() { }
+    shared() { }
 }
 
 export default new WorkletContext()

src/components/Navbar/index.less

@@ -1,21 +1,21 @@
 .nav-bar {
-  .nav-bar-navigation {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    color: #000;
-    position: relative;
+    .nav-bar-navigation {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: #000;
+        position: relative;
 
 
-    .back-icon {
-      position: absolute;
-      left: 40px;
-      height: 20px;
-      width: 20px;
-      border-width: 0 0 4px 4px;
-      border-color: #000;
-      border-style: solid;
-      transform: matrix(0.71, 0.71, -.71, 0.71, 0, 0);
+        .back-icon {
+            position: absolute;
+            left: 40px;
+            height: 20px;
+            width: 20px;
+            border-width: 0 0 4px 4px;
+            border-color: #000;
+            border-style: solid;
+            transform: matrix(0.71, 0.71, -.71, 0.71, 0, 0);
+        }
     }
-  }
 }

src/components/Navbar/index.tsx

@@ -4,29 +4,29 @@ import { getTopSafeHeight } from '@/utils'
 import './index.less'
 
 type NavbarPropsType = {
-  title?: string
-  status?: boolean
-  navigation?: boolean
-  navigationColor?: string
-  textColor?: string
+    title?: string
+    status?: boolean
+    navigation?: boolean
+    navigationColor?: string
+    textColor?: string
 }
-function Navbar({title, status, navigation, textColor='', navigationColor=''}: NavbarPropsType) {
-  const { navigationBarHeight, statusBarHeight} = getTopSafeHeight()
+function Navbar({ title, status, navigation, textColor = '', navigationColor = '' }: NavbarPropsType) {
+    const { navigationBarHeight, statusBarHeight } = getTopSafeHeight()
 
-  function navigateBack() {
-    Taro.navigateBack()
-  }
+    function navigateBack() {
+        Taro.navigateBack()
+    }
 
-  return (
-    <View className='nav-bar' style={{ height: 'auto', width: '100vw'}}>
-      {status && <View className='nav-bar-status' style={{ height: `${statusBarHeight}px`}}></View>}
+    return (
+        <View className='nav-bar' style={{ height: 'auto', width: '100vw' }}>
+            {status && <View className='nav-bar-status' style={{ height: `${statusBarHeight}px` }}></View>}
 
-      {navigation && <View className='nav-bar-navigation' style={{ height: `${navigationBarHeight}px`, color: textColor}}>
-        <View className='back-icon' style={{borderColor: navigationColor}} onClick={navigateBack}></View>
-        {title}
-      </View>}
-    </View>
-  )
+            {navigation && <View className='nav-bar-navigation' style={{ height: `${navigationBarHeight}px`, color: textColor }}>
+                <View className='back-icon' style={{ borderColor: navigationColor }} onClick={navigateBack}></View>
+                {title}
+            </View>}
+        </View>
+    )
 }
 
 export default Navbar

src/components/Navbar/index.wxss

@@ -0,0 +1,17 @@
+.nav-bar .nav-bar-navigation {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #000;
+  position: relative;
+}
+.nav-bar .nav-bar-navigation .back-icon {
+  position: absolute;
+  left: 40px;
+  height: 20px;
+  width: 20px;
+  border-width: 0 0 4px 4px;
+  border-color: #000;
+  border-style: solid;
+  transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
+}

src/components/VideoSwiper/index.config.ts

@@ -1,5 +1,5 @@
 export default definePageConfig({
-  // 兼容 skyline 不要删除
-  disableScroll: true,
-  navigationStyle: 'custom'
+    // 兼容 skyline 不要删除
+    disableScroll: true,
+    navigationStyle: 'custom'
 })

src/components/VideoSwiper/index.less

@@ -32,8 +32,8 @@
                     height: 6px;
                     border-radius: 3px;
                     background-color: #0f0f0f;
-    
-                    .progress{
+
+                    .progress {
                         height: inherit;
                         border-radius: 4px 0 0 4px;
                         background-color: #4c4c4c;
@@ -41,7 +41,7 @@
                 }
             }
 
-            .progress-indicator{
+            .progress-indicator {
                 position: absolute;
                 bottom: 20px;
                 left: 0;
@@ -51,6 +51,8 @@
                 flex-direction: column;
                 justify-content: space-between;
                 align-items: center;
+                background-color: linear-gradient(to bottom, rgba(0, 0, 0, 0), 10%, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
+                ;
 
                 .showInfo {
                     display: flex;
@@ -61,22 +63,26 @@
                     justify-content: center;
                     font-size: 36px;
                     font-weight: 500;
+
                     .showInfo-a {
                         height: 60px;
                         color: #fff;
                         margin-right: 20px;
                     }
-                    .showInfo-m{
+
+                    .showInfo-m {
                         height: 24px;
                         width: 2px;
                         background-color: #999;
                     }
+
                     .showInfo-b {
                         height: 60px;
                         color: #999;
                         margin-left: 20px;
                     }
                 }
+
                 .indicator-bg {
                     display: flex;
                     flex-direction: row;
@@ -86,11 +92,12 @@
                     align-items: center;
                     border-radius: 10px;
 
-                    .indcator-active{
+                    .indcator-active {
                         height: 20px;
                         background-color: #d5d5d5;
                         border-radius: 10px 0 0 10px;
                     }
+
                     .indicator-dot {
                         background-color: white;
                         height: 32px;
@@ -170,7 +177,7 @@
             font-size: 32px;
             padding: 0 20px;
             text-shadow: #000 1px 0 6px;
-            background: linear-gradient(to bottom, rgba(0, 0, 0, 0), 10%, rgba(0, 0, 0, .1), rgba(0, 0, 0, 0));
+            background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), 10%, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0.1));
 
             .video-user-info {
                 display: flex;
@@ -189,7 +196,7 @@
                 margin: 20px 0;
             }
 
-            .redShareBtn{
+            .redShareBtn {
                 width: 90%;
                 height: 80px;
                 background-color: #EE2C4F;
@@ -235,6 +242,7 @@
                     height: 70px;
                     margin-bottom: 10px;
                 }
+
                 .text {
                     width: 30px;
                     font-size: 30px;
@@ -252,11 +260,13 @@
                 height: 110px;
                 margin-top: 40px;
                 font-size: 26px;
+
                 image {
                     width: 70px;
                     height: 70px;
                     margin-bottom: 10px;
                 }
+
                 .text {
                     color: white;
                     width: 90px;
@@ -350,4 +360,4 @@
             transform: translate(0px, -150px);
         }
     }
-}
+}

src/components/VideoSwiper/index.tsx

@@ -1,16 +1,15 @@
-import { useEffect, useState, useImperativeHandle, memo, forwardRef } from 'react'
+import { useEffect, useState } from 'react'
 import Taro, { useLoad, useReady } from '@tarojs/taro'
 import {
     Swiper, SwiperItem, Video,
-    View, Image, Button, Progress
+    View, Image, Button
 } from '@tarojs/components'
-import { DETAIL_PAGESOURCE, CATEGORY_PAGESOURCE, VIEW_AUTO_TYPE } from '@/const'
-// import { favoriteUrl, unfavoriteUrl } from '@/http/api'
 import Route from '@/class/Route'
+import { DETAIL_PAGESOURCE, CATEGORY_PAGESOURCE, VIEW_AUTO_TYPE } from '@/const'
 import { videoViewReport, videoPlayReport, videoActionReport } from '@/logger'
 import { once, formatSecondsAsTime } from '@/utils'
+import { VideoInfo, PlayState } from '@/constants/commentTypes'
 import './index.less'
-import { PlayState } from '@/constants/commentTypes'
 
 
 let activeIndex = 0
@@ -20,22 +19,20 @@ let isUp = false
 
 const videoViewedMap = new Map()
 
-export default function VideoSwiper({ list, onFinish, needResumePlay }) {
+export default function VideoSwiper({ list, onFinish, needResumePlay, flushList }) {
     const [currentIndex, setCurrentIndex] = useState(0)
     const [circular, setCircular] = useState(false)
+    const [videoList, setVideoList] = useState<VideoInfo[]>(list.slice(0, 3))
     const [showRedShareBtn, setShowRedShareBtn] = useState(false)
     const [seekProgress, setSeekProgress] = useState(false)
     const [needPlayerResume, setNeedPlayerResume] = useState(false)
 
-
-    const [videoList, setVideoList] = useState<VideoInfo[]>(list.slice(0, 3))
     useReady(() => {
         activeIndex = 0
         videoViewedMap.clear()
     })
 
     useLoad(() => {
-
     })
 
     /**
@@ -44,7 +41,6 @@ export default function VideoSwiper({ list, onFinish, needResumePlay }) {
      * @return {*}
      */
     function didTimeUpdate(e) {
-        // console.log(e)
         let { currentTime = 0, duration = 1000000 } = e
         if (!showRedShareBtn && currentTime / duration >= 0.1) {
             setShowRedShareBtn(true)
@@ -127,10 +123,16 @@ export default function VideoSwiper({ list, onFinish, needResumePlay }) {
     }
 
     useEffect(() => {
-        if (list.length > 0 && videoList.length == 0) {
-            setVideoList(list.slice(0, 3))
+        if (list.length > 0 && videoList.length < 3) {
+            setVideoList(list.slice(0, Math.min(list.length, 3)))
         }
     }, [list])
+
+    useEffect(() => {
+        if (flushList && list.length > 0) {
+            setVideoList(list.slice(0, Math.min(list.length, 3)))
+        }
+    }, [flushList])
     useEffect(() => {
         if (needResumePlay) {
             replayCurrentVideo()
@@ -176,6 +178,10 @@ function CustomVideo({ video, current, index, onTimeUpdate, onProgressMove, need
     const [playTimeWhenMove, setPlayTimeWhenMove] = useState(0)
     const [currentPlayTime, setCurrentPlayTime] = useState(0)
     const [startMoveX, setStartMoveX] = useState(0)
+    const [hasReportPlaySuccess, setHasReportPlaySuccess] = useState(false)
+    const [hasReportRealplay, setHasReportRealplay] = useState(false)
+    const [updatePlayerVideoIdx, setUpdatePlayerVideoIdx] = useState(-1)
+    const [detail, setDetail] = useState({})
 
     let videoContext = Taro.createVideoContext(`${video.id}`)
     const logReportVideoPlaySuccessOnce = once(logReportVideoPlaySuccess)
@@ -184,10 +190,8 @@ function CustomVideo({ video, current, index, onTimeUpdate, onProgressMove, need
 
     useEffect(() => {
         logReportVideoView(video, current, index)
-
         if (current === index) {
             playerPlay()
-
             logReportVideoPlay(video)
         } else {
             playerPause()
@@ -197,8 +201,9 @@ function CustomVideo({ video, current, index, onTimeUpdate, onProgressMove, need
     useEffect(() => {
         setShowEndCover(false)
     }, [current])
+
     useEffect(() => {
-        if (needResumePlay && current == index){
+        if (needResumePlay && current == index) {
             playerPlay()
         }
     }, [current, needResumePlay])
@@ -236,9 +241,14 @@ function CustomVideo({ video, current, index, onTimeUpdate, onProgressMove, need
         onTimeUpdate(detail)
         setDurPersec(currentTime / duration)
 
-        logReportVideoPlaySuccessOnce(video)
-        if (durPersec >= 0.3 || currentTime >= 20)
+        if (!hasReportPlaySuccess) {
+            setHasReportPlaySuccess(true)
+            logReportVideoPlaySuccessOnce(video)
+        }
+        if (!hasReportRealplay && (durPersec >= 0.3 || currentTime >= 20)) {
+            setHasReportRealplay(true)
             logReportVideoRealPlayOnce(video)
+        }
     }
 
     function didPaused() {
@@ -267,7 +277,6 @@ function CustomVideo({ video, current, index, onTimeUpdate, onProgressMove, need
         setShowEndCover(false)
         videoContext.seek(0)
         playerPlay()
-        logReportVideoPlay(video)
     }
 
     function onTouchStart(e) {
@@ -276,6 +285,7 @@ function CustomVideo({ video, current, index, onTimeUpdate, onProgressMove, need
         setStartMoveX(clientX)
         onProgressMove(true)
         setShowProgressIndicator(true)
+        setSeekTime(currentPlayTime)
         setPlayTimeWhenMove(currentPlayTime)
     }
 
@@ -284,11 +294,6 @@ function CustomVideo({ video, current, index, onTimeUpdate, onProgressMove, need
         let rate = coculationRate(clientX - startMoveX)
 
         changeIndicator(rate)
-        // 移动中
-        //计算 seek 进度，并设置播放器 seek。 等比设置：拖动屏幕宽距离，偏移 50% 进度
-
-
-
     }
 
     function onTouchEnd(e) {

src/components/VideoSwiper/index.wxss

@@ -47,6 +47,7 @@
   flex-direction: column;
   justify-content: space-between;
   align-items: center;
+  background-color: linear-gradient(to bottom, rgba(0, 0, 0, 0), 10%, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
 }
 .video-swiper .video-swiper-item .custom-video .progress-indicator .showInfo {
   display: flex;
@@ -155,7 +156,7 @@
   font-size: 32px;
   padding: 0 20px;
   text-shadow: #000 1px 0 6px;
-  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), 10%, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
+  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), 10%, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.1));
 }
 .video-swiper .video-swiper-item .video-introduce .video-user-info {
   display: flex;

src/const/Enum.ts

@@ -1,8 +1,8 @@
 export const VIDEO_FRONTEND_PRE_VIEW = 'videoPreViewFrontEnd'
 
 export const VIEW_AUTO_TYPE = {
-  topVideoView: 0,
-  userScrollView: 1,
-  autoNextScrollView: 2, //自动播放下一个
-  clickView: 3
+    topVideoView: 0,
+    userScrollView: 1,
+    autoNextScrollView: 2, //自动播放下一个
+    clickView: 3
 }

src/const/index.ts

@@ -16,7 +16,7 @@ export const DEFAULT_ICON = 'http://weapppiccdn.yishihui.com/wxicon/common/icon_
 export const LIKE_ICON = 'http://weapppiccdn.yishihui.com/wxicon/common/icon_share_collect_s.png'
 
 export const USER_SENCE = {
-  share: '0',
-  category: '1',
-  home: '2'
+    share: '0',
+    category: '1',
+    home: '2'
 }

src/constants/commentTypes.ts

@@ -2,7 +2,7 @@ export const PlayState = {
     prepared: 1,
     playing: 2,
     pause: 3,
-    stoped: 4, 
+    stoped: 4,
 }
 
 export type VideoInfo = {
@@ -13,6 +13,7 @@ export type VideoInfo = {
     videoPath: string;
     recomTraceId: string;
     flowPool: string;
+    pageSource: string;
     user: {
         uid: number;
         nickName: string;

src/custom-tab-bar/index.config.ts

@@ -1,3 +1,3 @@
 export default {
     "component": true
-  }
+}

src/custom-tab-bar/index.less

@@ -7,9 +7,9 @@
     background: white;
     display: flex;
     padding-bottom: env(safe-area-inset-bottom);
-  }
-  
-  .tab-bar-border {
+}
+
+.tab-bar-border {
     background-color: rgba(0, 0, 0, 0.33);
     position: absolute;
     left: 0;
@@ -17,28 +17,29 @@
     width: 100%;
     height: 1px;
     transform: scaleY(0.5);
-  }
-  
-  .tab-bar-item {
+}
+
+.tab-bar-item {
     flex: 1;
     text-align: center;
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: column;
+
     .line {
         width: 100px;
         height: 8px;
         margin-top: 20px;
         background-color: white;
     }
-  }
-  
-  .tab-bar-item cover-image {
+}
+
+.tab-bar-item cover-image {
     width: 54px;
     height: 54px;
-  }
-  
-  .tab-bar-item cover-view {
+}
+
+.tab-bar-item cover-view {
     font-size: 20px;
-  }
+}

src/custom-tab-bar/index.tsx

@@ -5,50 +5,50 @@ import { CoverView, View } from '@tarojs/components'
 import './index.less'
 
 export default class Index extends Component {
-  state = {
-    selected: 0,
-    color: '#999999',
-    selectedColor: '#ffffff',
-    backgroundColor: '#000000',
-    fontSize: 22,
-    list: [
-      {
-        pagePath: '/pages/category/index',
-        text: '首页'
-      },
-      {
-        pagePath: '/pages/home/home',
-        text: '我的'
-      }
-    ]
-  }
+    state = {
+        selected: 0,
+        color: '#999999',
+        selectedColor: '#ffffff',
+        backgroundColor: '#000000',
+        fontSize: 22,
+        list: [
+            {
+                pagePath: '/pages/category/index',
+                text: '首页'
+            },
+            {
+                pagePath: '/pages/home/home',
+                text: '我的'
+            }
+        ]
+    }
 
-  switchTab(index, url) {
-    this.setSelected(index)
-    Taro.switchTab({ url })
-  }
+    switchTab(index, url) {
+        this.setSelected(index)
+        Taro.switchTab({ url })
+    }
 
-  setSelected (idx: number) {
-    this.setState({
-      selected: idx
-    })
-  }
+    setSelected(idx: number) {
+        this.setState({
+            selected: idx
+        })
+    }
 
-  render() {
-    const { list, selected, color, selectedColor, backgroundColor, fontSize } = this.state
+    render() {
+        const { list, selected, color, selectedColor, backgroundColor, fontSize } = this.state
 
-    return (
-      <CoverView className='tab-bar' style={{ backgroundColor: backgroundColor}}>
-        <CoverView className='tab-bar-border'></CoverView>
-        {list.map((item, index) => {
-          return (
-            <CoverView key={index} className='tab-bar-item' onClick={this.switchTab.bind(this, index, item.pagePath)}>
-              <CoverView style={{ color: selected === index ? selectedColor : color, fontSize: fontSize }}>{item.text}</CoverView>
-              <View className='line' style={{ backgroundColor: selected === index ? 'white' : 'transparent'  }}></View>
+        return (
+            <CoverView className='tab-bar' style={{ backgroundColor: backgroundColor }}>
+                <CoverView className='tab-bar-border'></CoverView>
+                {list.map((item, index) => {
+                    return (
+                        <CoverView key={index} className='tab-bar-item' onClick={this.switchTab.bind(this, index, item.pagePath)}>
+                            <CoverView style={{ color: selected === index ? selectedColor : color, fontSize: fontSize }}>{item.text}</CoverView>
+                            <View className='line' style={{ backgroundColor: selected === index ? 'white' : 'transparent' }}></View>
+                        </CoverView>
+                    )
+                })}
             </CoverView>
-          )
-        })}
-      </CoverView>
-    )
-  }
+        )
+    }
 }

src/hooks/useHotLaunch.ts

@@ -3,11 +3,11 @@ import { useDidShow } from '@tarojs/taro'
 type useHotLaunchCbType = (options) => void
 
 export default function useHotLaunch(cb: useHotLaunchCbType) {
-  useDidShow((options) => {
-    useHotLaunch.valid && cb(options)
+    useDidShow((options) => {
+        useHotLaunch.valid && cb(options)
 
-    useHotLaunch.valid = true
-  })
+        useHotLaunch.valid = true
+    })
 }
 
 useHotLaunch.valid = true

src/http/api/base.ts

@@ -1,17 +1,17 @@
 export const BASE_DOMAIN = {
-  development: 'https://videotest.yishihui.com',
-  staging: 'https://videopre.piaoquantv.com',
-  production: 'https://vlogapi.piaoquantv.com'
+    development: 'https://videotest.yishihui.com',
+    staging: 'https://videopre.piaoquantv.com',
+    production: 'https://vlogapi.piaoquantv.com'
 }
 
 export const INVITE_API_DOMAIN = {
-  development: 'https://testapi.piaoquantv.com',
-  staging: 'https://preapi.piaoquantv.com',
-  production: 'https://api.piaoquantv.com'
+    development: 'https://testapi.piaoquantv.com',
+    staging: 'https://preapi.piaoquantv.com',
+    production: 'https://api.piaoquantv.com'
 }
 
 export const BASE_COMMON_DOMAIN = {
-  development: 'https://videotest.yishihui.com',
-  staging: 'https://precommon.piaoquantv.com',
-  production: 'https://common.piaoquantv.com'
+    development: 'https://videotest.yishihui.com',
+    staging: 'https://precommon.piaoquantv.com',
+    production: 'https://common.piaoquantv.com'
 }

src/http/api/index.ts

@@ -2,8 +2,8 @@ import Taro from '@tarojs/taro'
 import { BASE_DOMAIN, INVITE_API_DOMAIN, BASE_COMMON_DOMAIN } from './base'
 
 function env(BASE_DOMAIN) {
-  const envApi = Taro.getStorageSync('env')
-  return BASE_DOMAIN[envApi || 'production']
+    const envApi = Taro.getStorageSync('env')
+    return BASE_DOMAIN[envApi || 'production']
 }
 
 export const ossSignatureUrl = `${env(BASE_DOMAIN)}/longvideoapi/oss/signature`

src/http/index.ts

@@ -3,150 +3,149 @@ import Route from '@/class/Route'
 import { APP_ID, APP_TYPE, APP_VERSION_CODE, VERSION_CODE } from '@/config'
 
 class Http {
-  get(url: string, data = {}, config: ConfigType = {}) {
-    const { header = {} } = config
-
-    data = wrapData(data)
+    get(url: string, data = {}, config: ConfigType = {}) {
+        const { header = {} } = config
+
+        data = wrapData(data)
+
+        return new Promise((success, fail) => {
+            const expParams: ConfigType = {
+                header: {
+                    'content-type': 'application/x-www-form-urlencoded',
+                    ...header
+                }
+            }
+
+            Taro.request({
+                url,
+                data,
+                success,
+                fail,
+                ...expParams
+            })
+        })
+    }
 
-    return new Promise((success, fail) => {
-      const expParams: ConfigType = {
-        header: {
-          'content-type': 'application/x-www-form-urlencoded',
-          ...header
-        }
-      }
-
-      Taro.request({
-        url,
-        data,
-        success,
-        fail,
-        ...expParams
-      })
-    })
-  }
-
-  post(url: string, data = {}, config: ConfigType = {}) {
-    const { header = {} } = config
-
-    data = wrapData(data)
-
-    if ((data as DataType).baseInfo)
-      data = createBaseInfoToFetchData(data)
-
-    return new Promise((resolve, reject) => {
-      const expParams: ConfigType = {
-        header: {
-          'content-type': 'application/x-www-form-urlencoded',
-          ...header
-        },
-        method: 'POST'
-      }
-
-      Taro.request({
-        url,
-        data,
-        success(res) {
-          const { data, statusCode } = res
-
-          if (statusCode !== 200) {
-            reject(data)
-            return
-          }
-
-          resolve(data)
-        },
-        fail(res) {
-          reject(res)
-        },
-        ...expParams
-      })
-    })
-  }
+    post(url: string, data = {}, config: ConfigType = {}) {
+        const { header = {} } = config
+
+        data = wrapData(data)
+
+        if ((data as DataType).baseInfo)
+            data = createBaseInfoToFetchData(data)
+
+        return new Promise((resolve, reject) => {
+            const expParams: ConfigType = {
+                header: {
+                    'content-type': 'application/x-www-form-urlencoded',
+                    ...header
+                },
+                method: 'POST'
+            }
+
+            Taro.request({
+                url,
+                data,
+                success(res) {
+                    const { data, statusCode } = res
+
+                    if (statusCode !== 200) {
+                        reject(data)
+                        return
+                    }
+
+                    resolve(data)
+                },
+                fail(res) {
+                    reject(res)
+                },
+                ...expParams
+            })
+        })
+    }
 }
 
 export function wrapData(params) {
-  const systemInfo = Taro.$global.get('systemInfo')
-  const launchOption = Taro.$global.get('launchOption')
-  const isReturningUser = Taro.$global.get('isReturningUser')
-  const userInfo = Taro.$global.get('userInfo') || {}
-  const EXPERIMENT_CONFIG = Taro.getStorageSync('$EXPERIMENT_CONFIG')
-
-  const route = new Route()
-
-  const defaultInfo = {
-    appId: APP_ID,
-    appType: APP_TYPE,
-    realAppType: APP_TYPE, // ？
-    versionCode: VERSION_CODE,
-    appVersionCode: APP_VERSION_CODE,
-    token: userInfo.accessToken || '',
-    loginUid: userInfo.uid || '',
-    clientTimestamp: new Date().getTime(),
-    pageSource: route.path,
-    machineCode: Taro.$global.get('mid') || '',
-    machineInfo: getMachineInfoFromSystem(),
-    networkType: Taro.$network.networkType,
-    network: Taro.$network.networkType,
-    platform: systemInfo.platform,
-    system: systemInfo.system,
-    careModelStatus: systemInfo.easyMode,
-    senceType: launchOption.scene,
-    hotSenceType: launchOption.hotScene,
-    abExpInfo: JSON.stringify(EXPERIMENT_CONFIG),
-    sessionId: Taro.$global.get('sessionId'),
-    subSessionId: Taro.$global.get('subSessionId'),
-  }
-
-  // 单独处理30天无回流
-  if (isReturningUser) {
-    params.extParams = JSON.stringify({
-      ...params?.extParams,
-      has30DayReturnCnt: isReturningUser
-    })
-  }
+    const systemInfo = Taro.$global.get('systemInfo') || {}
+    const launchOption = Taro.$global.get('launchOption')
+    const isReturningUser = Taro.$global.get('isReturningUser')
+    const userInfo = Taro.$global.get('userInfo') || {}
+    const EXPERIMENT_CONFIG = Taro.getStorageSync('$EXPERIMENT_CONFIG')
+
+    const route = new Route()
+
+    const defaultInfo = {
+        appId: APP_ID,
+        appType: APP_TYPE,
+        realAppType: APP_TYPE, // ？
+        versionCode: VERSION_CODE,
+        appVersionCode: APP_VERSION_CODE,
+        token: userInfo.accessToken || '',
+        loginUid: userInfo.uid || '',
+        clientTimestamp: new Date().getTime(),
+        pageSource: route.path,
+        machineCode: Taro.$global.get('mid') || '',
+        machineInfo: getMachineInfoFromSystem(systemInfo),
+        networkType: Taro.$network.networkType,
+        network: Taro.$network.networkType,
+        platform: systemInfo.platform,
+        system: systemInfo.system,
+        careModelStatus: systemInfo.easyMode,
+        senceType: launchOption.scene,
+        hotSenceType: launchOption.hotScene,
+        abExpInfo: JSON.stringify(EXPERIMENT_CONFIG),
+        sessionId: Taro.$global.get('sessionId'),
+        subSessionId: Taro.$global.get('subSessionId'),
+    }
+
+    // 单独处理30天无回流
+    if (isReturningUser) {
+        params.extParams = JSON.stringify({
+            ...params?.extParams,
+            has30DayReturnCnt: isReturningUser
+        })
+    }
 
-  return {
-    ...defaultInfo,
-    ...params
-  }
+    return {
+        ...defaultInfo,
+        ...params
+    }
 }
 
 export function createBaseInfoToFetchData(data) {
-  const baseKey = ['token', 'loginUid', 'appType', 'machineCode', 'platform', 'machineInfo', 'networkType', 'pageSource', 'rootPageSource', 'clientTimestamp', 'sessionId', 'subSessionId', 'requestId', 'pageCategoryId', 'rootPageCategoryId', 'openType', 'shareDepth', 'eventId', 'videoReportMeta', 'rootPageTimestamp', 'returnId', 'system']
+    const baseKey = ['token', 'loginUid', 'appType', 'machineCode', 'platform', 'machineInfo', 'networkType', 'pageSource', 'rootPageSource', 'clientTimestamp', 'sessionId', 'subSessionId', 'requestId', 'pageCategoryId', 'rootPageCategoryId', 'openType', 'shareDepth', 'eventId', 'videoReportMeta', 'rootPageTimestamp', 'returnId', 'system']
 
-  return Object.keys(data).reduce((calc, key) => {
-    if (baseKey.includes(key)) {
-      calc.baseInfo[key] = data[key]
-    } else {
-      calc.params[key] = data[key]
-    }
+    return Object.keys(data).reduce((calc, key) => {
+        if (baseKey.includes(key)) {
+            calc.baseInfo[key] = data[key]
+        } else {
+            calc.params[key] = data[key]
+        }
 
-    return calc
-  }, { baseInfo: {}, params: {} })
+        return calc
+    }, { baseInfo: {}, params: {} })
 }
 
-export function getMachineInfoFromSystem() {
-  const systemInfo = Taro.$global.get('systemInfo')
-  const keys = ['sdkVersion', 'brand', 'language', 'model', 'platform', 'system', 'version', 'screenHeight', 'screenWidth', 'pixelRatio', 'windowHeight', 'windowWidth']
+export function getMachineInfoFromSystem(systemInfo) {
+    const keys = ['sdkVersion', 'brand', 'language', 'model', 'platform', 'system', 'version', 'screenHeight', 'screenWidth', 'pixelRatio', 'windowHeight', 'windowWidth']
 
-  const result = keys.reduce((calc, key) => {
-    // 适配其他小程序数据上报
-    if (key === 'version')
-      key = 'weChatVersion'
+    const result = keys.reduce((calc, key) => {
+        // 适配其他小程序数据上报
+        if (key === 'version')
+            key = 'weChatVersion'
 
-    if (key === 'SDKVersion')
-      key = 'sdkVersion'
+        if (key === 'SDKVersion')
+            key = 'sdkVersion'
 
-    calc[key] = systemInfo[key]
+        calc[key] = systemInfo[key]
 
-    return calc
-  }, {})
+        return calc
+    }, {})
 
-  return JSON.stringify({
-    softVersion: '', // TODO： appConfig.versionName
-    ...result
-  })
+    return JSON.stringify({
+        softVersion: '', // TODO： appConfig.versionName
+        ...result
+    })
 }
 
 export default new Http()

src/logger/const.ts

@@ -1,249 +1,249 @@
 export const eventId = {
-  /**
-   * eventId 由6位构成，由前端开发自定义
-   * 前3为为小分类标记，例如页面、组件等标识
-   * 100-299 视频相关
-   * 300-399 小程序页面
-   * 400-799 预留字段
-   * 800-899 H5相关、pc站相关
-   * 900-999 图片加工相关
-   * 后三位为事件标记
-   *
-   * e.g.900001进入图片加工main页
-   */
-
-  //900+ 图片加工相关字段
-
-  //901是首页进行的操作
-  clickMakeAlbum: '901001', //点击首页做影集
-  //902是制作页进行的操作
-  enterMakePageFromShare1: '902001', //进入制作页(做影集)
-  enterMakePageFromShare6: '902002', //进入制作页(做同款)
-  makePageDrawingCompleteFromShare1: '902003', //制作页渲染完成(做影集)
-  makePageDrawingCompleteFromShare6: '902004', //制作页渲染完成(做同款)
-  clickSaveFromShare1: '902005', //制作页点击保存(做影集)
-  clickSaveFromShare6: '902006', //制作页点击保存(做同款)
-  clickShareFromShare1: '902007', //制作页点击分享(做影集)
-  clickShareFromShare6: '902008', //制作页点击分享(做同款)
-  //903是完成页
-  enterCompletePageFromShare1: '903001', //进入完成页(做影集)
-  enterCompletePageFromShare6: '903002', //进入完成页(做同款)
-  //904是编辑页(影集编辑进入)
-  //905是分享进入页
-  clickMakeSame: '905001', //点击做同款
-
-  //950+ debug日志
-  requestFailDebug: '950001',
-  requestErrorDebug: '950002',
-  debugUserVideoFolder: '951001',
-  debugShortVideoShare: '952001',
-
-  /**
-   * 片尾测试 106
-   */
-  tailVideoPlayed: '106001', //带片尾的视频播放
-  tailVideoPlayedTail: '106002', //带片尾的视频播放了片尾
-  videoSharedWithTail: '106003', //片尾测试的视频，分享的时候视频是带片尾的
-  videoSharedWithoutTail: '106004', //片尾测试的视频，分享的时候视频是没有带片尾的
-  VideoEditMusicOperation: '100001',
-  withoutTailVideoPlayed: '106005', //没有带片尾的视频播放
-  videoPlayEndWithoutTail: '106006', //没有带片尾的视频播放完成
-  videoPlayEndWithTail: '106007', //带片尾的视频播放完成
-  tailVideoSharedPre: '106008', //带片尾视频片尾前被分享
-  tailVideoSharedLast: '106009', //看了片尾并分享
-  tailVideoSharedEnd: '106010', //带片尾视频播完片尾后被分享
-
-  /**
-   * 视频封面加载 - 107
-   */
-  videoCoverLoad: '107001', //封面加载完成
-  videoCoverLoadError: '107002', //封面加载失败
-
-  /**
-   * 播放时长 - 108
-   */
-  videoPlayDuration: '108001', //视频暂停，停止播放的时长上报
-
-  /**
-   * 用户活跃 - 109
-   */
-  userActiveAction: '109001', //用户活跃日志
-
-  /**
-   * 首页跳转 - 110
-   */
-  categoryPrepare2Route: '110001', //首页启动准备跳转
-  videoShareRouteSuccess: '110002', //首页跳转分享页成功
-  otherShareRouteSuccess: '110003', //首页跳转其他分享页成功
-  videoShareRouteFail: '110004', //首页跳转分享页失败
-  otherShareRouteFail: '110005', //首页跳转其他分享页失败
-  videoShareLaunchFromRouter: '110006', //分享页启动从首页跳转
-  videoShareLaunchFromApp: '110007', //分享页启动从直接启动页面
-  videoShareOpenByDirect: '110008', //直接打开视频分享页
-  videoShareOpenByRoute: '110009', //首页跳转打开视频分享页
-  /**
-   * 关注 - 301
-   */
-  hasFollowVideo: 301001, //有关注视频
-  withoutFollowVideo: 301002, //无关注视频
-  followPageComAttached: 301003, //关注页启动
-
-  /**
-   * feed流页面
-   */
-  inVideoTab: 302001, // 视频tab
-  inCommentTab: 302002, // 评论tab
-  inShareSummaryTab: 302003, // 分享空间tab
-
-  /**
-   * 滑动引导
-   */
-  haveShowScrollGuide: 110100, //显示了滑动引导
-  withoutScrollGuide: 110101, //没显示滑动引导
-  haveShowOldScrollGuide: 110102, //显示了老的滑动引导
-  /**
-   * 活动事件
-   */
-  enterNativeActivity: 120001, //进入活动页面
-
-  /**
-   * 广告
-   */
-  adLoad: 130001, // 广告组加载成功
-  adError: 130002, // 广告组件加载失败
-  adClose: 130003, // 广告组件关闭
-  adPlay: 130004, // 广告组件播放
-  adView: '130009', // 广告组件曝光
-  adAttached: '130010', // 广告组件加入页面
-
-  interstitialAdLoadSuccess: '130005', //插屏广告加载成功
-  interstitialAdLoadError: '130006', //插屏广告加载失败
-  interstitialAdShowSuccess: '130007', //插屏广告显示成功
-  interstitialAdShowError: '130008', //插屏广告显示失败
-  interstitialAdCreate: '130011', // 创建插屏广告
-
-  test1: '1301200',
-  test2: '1300013',
-  test3: '1300014',
-
-  //平台广告
-  pfAdStartValidate: '140001', //开始校验广告
-  pfAdValidateSuccess: '140002', //校验成功上报
-  pfAdValidateFail: '140003', //校验失败上报
-
-  //站外消息
-  offSiteNews: '160000',
-  //消息H5漏斗事件
-  msgH5: '150000',
-  //上传Banner点击
-  clickPostBanner: 170001,
-  //首页模块上报
-  homeBanner: 180001,
-  homeIcon: 180002,
-  //内存告警
-  memoryWarning: 190000,
-
-  // 点击app下载分享卡片
-  appDownloadCardClick: 230000,
-
-  downloadModalShow: 240000, //下载弹窗显示
-  downloadModalClick: 240001, //点击下载弹窗下载按钮
-
-  hoverDownloadBtn: 240002, //悬浮下载app按钮
-  shareWindow: 240003, //悬浮下载app按钮
-
-  buttonClick: 300000, //按钮点击相关上报
-  buttonView: 300001, //按钮曝光
-  buttonSlide: 300011, // 广告滑动事件
-  
-  windowView: 300002, //弹窗曝光
-  pageView: 300003, //页面曝光
-  pageBack: 300004, //复制成功
-  windowClose: 300005, //弹窗曝光
-  sharePopupAVlogCode: 330001,
-  sharePopupBVlogCode: 330002,
-  downAppGuideShow: 330011,
-  downAppGuideClick: 330012,
-  playActivityWindowShow: 330021,
-  playActivityWindowClick: 330022,
-
-  showGuideClipToolsPanel: 400000,
-
-  downAppGuideBtn: 400011,
-  downVideoFlow: 500001,
-  // 分享页页面
-  sharePageEventReport: '220221',
-  // 详情页页面
-  detailPageEventReport: '22022220',
-  // 详情页接口成功
-  detailRequestSuccessEventReport: '22022221',
-  // 详情页接口失败
-  detailRequestErrorEventReport: '22022222',
-
-  videoStepTime: 520000,
-  videoClickEvent: 299001,
-
-  // 请求超时
-  adPreLimt: 510400,
-  // 获取设备信息
-  sysInfoSuc: 510410,
-  sysInfoErr: 510411,
-  sysInfoExp: 510412,
-  sysInfoSucAsyn: 510413,
-
-  // 性能数据上报
-  appLaunch: 510420,
-  router: 510421,
-  scriptInject: 510422,
-  firstRender: 510423,
-
-
-  // home页跳转来源
-  homeFrom: 510432,
-  // 复制广告口令
-  copy_ad_success: 510440,
-  copy_ad_fail: 510441,
-  copy_ad_event: 510442,
-  clipboard_ad_success: 510443,
-
-  /*
-      小程序关闭爬虫用户入口 520开头
-  */
-  categoryClick: 520010, // 首页点击用户头像或昵称
-  followClick: 520021, // 关注页-已关注
-  unFollowClick: 520022, // 关注页-未关注
-  vHeadClick: 520031, // 视频列表页-头部
-  vContentClick: 520032, // 视频列表页-相关推荐
-  vCommentlistClick: 520033, // 视频列表页-评论列表
-  vCommentDHeadClick: 520034, // 视频列表页-评论详情-个人
-  vCommentDOthersClick: 520035, // 视频列表页-评论详情-其他回复
-  apperciateClick: 520036, // 赞赏页面
-  vDetailClick: 520040, // 沉浸式播放页
-
-  miniappToWechatDialog: 510433,
-  autoPlayVideoEventId: 510434,
-
-
-  selfAd_backBtn_Click: 510450,
-  selfAd_playBtn_Click: 510451,
-
-  errorScript: 540001,
-  errorReject: 540002,
-  errorPageNotFound: 540003,
+    /**
+     * eventId 由6位构成，由前端开发自定义
+     * 前3为为小分类标记，例如页面、组件等标识
+     * 100-299 视频相关
+     * 300-399 小程序页面
+     * 400-799 预留字段
+     * 800-899 H5相关、pc站相关
+     * 900-999 图片加工相关
+     * 后三位为事件标记
+     *
+     * e.g.900001进入图片加工main页
+     */
+
+    //900+ 图片加工相关字段
+
+    //901是首页进行的操作
+    clickMakeAlbum: '901001', //点击首页做影集
+    //902是制作页进行的操作
+    enterMakePageFromShare1: '902001', //进入制作页(做影集)
+    enterMakePageFromShare6: '902002', //进入制作页(做同款)
+    makePageDrawingCompleteFromShare1: '902003', //制作页渲染完成(做影集)
+    makePageDrawingCompleteFromShare6: '902004', //制作页渲染完成(做同款)
+    clickSaveFromShare1: '902005', //制作页点击保存(做影集)
+    clickSaveFromShare6: '902006', //制作页点击保存(做同款)
+    clickShareFromShare1: '902007', //制作页点击分享(做影集)
+    clickShareFromShare6: '902008', //制作页点击分享(做同款)
+    //903是完成页
+    enterCompletePageFromShare1: '903001', //进入完成页(做影集)
+    enterCompletePageFromShare6: '903002', //进入完成页(做同款)
+    //904是编辑页(影集编辑进入)
+    //905是分享进入页
+    clickMakeSame: '905001', //点击做同款
+
+    //950+ debug日志
+    requestFailDebug: '950001',
+    requestErrorDebug: '950002',
+    debugUserVideoFolder: '951001',
+    debugShortVideoShare: '952001',
+
+    /**
+     * 片尾测试 106
+     */
+    tailVideoPlayed: '106001', //带片尾的视频播放
+    tailVideoPlayedTail: '106002', //带片尾的视频播放了片尾
+    videoSharedWithTail: '106003', //片尾测试的视频，分享的时候视频是带片尾的
+    videoSharedWithoutTail: '106004', //片尾测试的视频，分享的时候视频是没有带片尾的
+    VideoEditMusicOperation: '100001',
+    withoutTailVideoPlayed: '106005', //没有带片尾的视频播放
+    videoPlayEndWithoutTail: '106006', //没有带片尾的视频播放完成
+    videoPlayEndWithTail: '106007', //带片尾的视频播放完成
+    tailVideoSharedPre: '106008', //带片尾视频片尾前被分享
+    tailVideoSharedLast: '106009', //看了片尾并分享
+    tailVideoSharedEnd: '106010', //带片尾视频播完片尾后被分享
+
+    /**
+     * 视频封面加载 - 107
+     */
+    videoCoverLoad: '107001', //封面加载完成
+    videoCoverLoadError: '107002', //封面加载失败
+
+    /**
+     * 播放时长 - 108
+     */
+    videoPlayDuration: '108001', //视频暂停，停止播放的时长上报
+
+    /**
+     * 用户活跃 - 109
+     */
+    userActiveAction: '109001', //用户活跃日志
+
+    /**
+     * 首页跳转 - 110
+     */
+    categoryPrepare2Route: '110001', //首页启动准备跳转
+    videoShareRouteSuccess: '110002', //首页跳转分享页成功
+    otherShareRouteSuccess: '110003', //首页跳转其他分享页成功
+    videoShareRouteFail: '110004', //首页跳转分享页失败
+    otherShareRouteFail: '110005', //首页跳转其他分享页失败
+    videoShareLaunchFromRouter: '110006', //分享页启动从首页跳转
+    videoShareLaunchFromApp: '110007', //分享页启动从直接启动页面
+    videoShareOpenByDirect: '110008', //直接打开视频分享页
+    videoShareOpenByRoute: '110009', //首页跳转打开视频分享页
+    /**
+     * 关注 - 301
+     */
+    hasFollowVideo: 301001, //有关注视频
+    withoutFollowVideo: 301002, //无关注视频
+    followPageComAttached: 301003, //关注页启动
+
+    /**
+     * feed流页面
+     */
+    inVideoTab: 302001, // 视频tab
+    inCommentTab: 302002, // 评论tab
+    inShareSummaryTab: 302003, // 分享空间tab
+
+    /**
+     * 滑动引导
+     */
+    haveShowScrollGuide: 110100, //显示了滑动引导
+    withoutScrollGuide: 110101, //没显示滑动引导
+    haveShowOldScrollGuide: 110102, //显示了老的滑动引导
+    /**
+     * 活动事件
+     */
+    enterNativeActivity: 120001, //进入活动页面
+
+    /**
+     * 广告
+     */
+    adLoad: 130001, // 广告组加载成功
+    adError: 130002, // 广告组件加载失败
+    adClose: 130003, // 广告组件关闭
+    adPlay: 130004, // 广告组件播放
+    adView: '130009', // 广告组件曝光
+    adAttached: '130010', // 广告组件加入页面
+
+    interstitialAdLoadSuccess: '130005', //插屏广告加载成功
+    interstitialAdLoadError: '130006', //插屏广告加载失败
+    interstitialAdShowSuccess: '130007', //插屏广告显示成功
+    interstitialAdShowError: '130008', //插屏广告显示失败
+    interstitialAdCreate: '130011', // 创建插屏广告
+
+    test1: '1301200',
+    test2: '1300013',
+    test3: '1300014',
+
+    //平台广告
+    pfAdStartValidate: '140001', //开始校验广告
+    pfAdValidateSuccess: '140002', //校验成功上报
+    pfAdValidateFail: '140003', //校验失败上报
+
+    //站外消息
+    offSiteNews: '160000',
+    //消息H5漏斗事件
+    msgH5: '150000',
+    //上传Banner点击
+    clickPostBanner: 170001,
+    //首页模块上报
+    homeBanner: 180001,
+    homeIcon: 180002,
+    //内存告警
+    memoryWarning: 190000,
+
+    // 点击app下载分享卡片
+    appDownloadCardClick: 230000,
+
+    downloadModalShow: 240000, //下载弹窗显示
+    downloadModalClick: 240001, //点击下载弹窗下载按钮
+
+    hoverDownloadBtn: 240002, //悬浮下载app按钮
+    shareWindow: 240003, //悬浮下载app按钮
+
+    buttonClick: 300000, //按钮点击相关上报
+    buttonView: 300001, //按钮曝光
+    buttonSlide: 300011, // 广告滑动事件
+
+    windowView: 300002, //弹窗曝光
+    pageView: 300003, //页面曝光
+    pageBack: 300004, //复制成功
+    windowClose: 300005, //弹窗曝光
+    sharePopupAVlogCode: 330001,
+    sharePopupBVlogCode: 330002,
+    downAppGuideShow: 330011,
+    downAppGuideClick: 330012,
+    playActivityWindowShow: 330021,
+    playActivityWindowClick: 330022,
+
+    showGuideClipToolsPanel: 400000,
+
+    downAppGuideBtn: 400011,
+    downVideoFlow: 500001,
+    // 分享页页面
+    sharePageEventReport: '220221',
+    // 详情页页面
+    detailPageEventReport: '22022220',
+    // 详情页接口成功
+    detailRequestSuccessEventReport: '22022221',
+    // 详情页接口失败
+    detailRequestErrorEventReport: '22022222',
+
+    videoStepTime: 520000,
+    videoClickEvent: 299001,
+
+    // 请求超时
+    adPreLimt: 510400,
+    // 获取设备信息
+    sysInfoSuc: 510410,
+    sysInfoErr: 510411,
+    sysInfoExp: 510412,
+    sysInfoSucAsyn: 510413,
+
+    // 性能数据上报
+    appLaunch: 510420,
+    router: 510421,
+    scriptInject: 510422,
+    firstRender: 510423,
+
+
+    // home页跳转来源
+    homeFrom: 510432,
+    // 复制广告口令
+    copy_ad_success: 510440,
+    copy_ad_fail: 510441,
+    copy_ad_event: 510442,
+    clipboard_ad_success: 510443,
+
+    /*
+        小程序关闭爬虫用户入口 520开头
+    */
+    categoryClick: 520010, // 首页点击用户头像或昵称
+    followClick: 520021, // 关注页-已关注
+    unFollowClick: 520022, // 关注页-未关注
+    vHeadClick: 520031, // 视频列表页-头部
+    vContentClick: 520032, // 视频列表页-相关推荐
+    vCommentlistClick: 520033, // 视频列表页-评论列表
+    vCommentDHeadClick: 520034, // 视频列表页-评论详情-个人
+    vCommentDOthersClick: 520035, // 视频列表页-评论详情-其他回复
+    apperciateClick: 520036, // 赞赏页面
+    vDetailClick: 520040, // 沉浸式播放页
+
+    miniappToWechatDialog: 510433,
+    autoPlayVideoEventId: 510434,
+
+
+    selfAd_backBtn_Click: 510450,
+    selfAd_playBtn_Click: 510451,
+
+    errorScript: 540001,
+    errorReject: 540002,
+    errorPageNotFound: 540003,
 
 }
 
 export const logType = {
-  abTest: 10, //abtestinfo-log
-  funnel: 20, //operation-log
-  independent: 30, //simpleevent-log
-  debug: 40, //frontend-log
-  playAction: 50, //playaction-log
-  useractiveLog: 60, //useractive-log
-  productionLog: 110, //video-production-log
-  adActionLog: 120, //ad-action-log
-  adActionNewLog: 170, //ad-new-action-log
-  apiMonitorLog: 180, //api-monitor : we-data
-  performanceMonitorLog: 190, //performance-log : we-data
-  errorLog: 27, //error-log
+    abTest: 10, //abtestinfo-log
+    funnel: 20, //operation-log
+    independent: 30, //simpleevent-log
+    debug: 40, //frontend-log
+    playAction: 50, //playaction-log
+    useractiveLog: 60, //useractive-log
+    productionLog: 110, //video-production-log
+    adActionLog: 120, //ad-action-log
+    adActionNewLog: 170, //ad-new-action-log
+    apiMonitorLog: 180, //api-monitor : we-data
+    performanceMonitorLog: 190, //performance-log : we-data
+    errorLog: 27, //error-log
 }

src/logger/index.ts

@@ -1,41 +1,41 @@
 import {
-  videoActionPreReportUrl, videoViewUrl, playedUrl,
-  videoActionReportUrl, shareReportUrl, weixinFriendUrl,
-  shareClickUrl
+    videoActionPreReportUrl, videoViewUrl, playedUrl,
+    videoActionReportUrl, shareReportUrl, weixinFriendUrl,
+    shareClickUrl
 } from '@/http/api'
 import http from '@/http/index'
 
 // category 卡片 preview 上报
 export function videoActionPreReport(params) {
-  return http.post(videoActionPreReportUrl, params)
+    return http.post(videoActionPreReportUrl, params)
 }
 
 // 视频曝光上报
 export function videoViewReport(params) {
-  return http.post(videoViewUrl, params)
+    return http.post(videoViewUrl, params)
 }
 
 // 视频曝光播放
 export function videoPlayReport(params) {
-  return http.post(playedUrl, params)
+    return http.post(playedUrl, params)
 }
 
 // 播放上报
 export function videoActionReport(params) {
-  return http.post(videoActionReportUrl, params)
+    return http.post(videoActionReportUrl, params)
 }
 
 // 分享 report 
 export function shareReport(params) {
-  return http.post(shareReportUrl, params)
+    return http.post(shareReportUrl, params)
 }
 
 // 分享 friend
 export function weixinFriend(params) {
-  return http.post(weixinFriendUrl, params)
+    return http.post(weixinFriendUrl, params)
 }
 
 // 回流 click
 export function shareClickReport(params) {
-  return http.post(shareClickUrl, params)
+    return http.post(shareClickUrl, params)
 }

src/logger/userActivieLog.ts

@@ -6,55 +6,55 @@ import { logType } from './const'
 const { useractiveLog } = logType
 
 // user action log
-export function userActivie (eventId, eventData = {}, extParams = {}) {
-  if (!eventId)
-    return
+export function userActivie(eventId, eventData = {}, extParams = {}) {
+    if (!eventId)
+        return
 
-  paramsPretreatmentAndRequest(useractiveLog, eventId, eventData, extParams)
+    paramsPretreatmentAndRequest(useractiveLog, eventId, eventData, extParams)
 }
 
 function paramsPretreatmentAndRequest(logType, eventId, eventData, extParams) {
-  const { pageSource = '' } = eventData
+    const { pageSource = '' } = eventData
 
-  const res: any = wrapData({
-    logType,
-    eventId,
-    eventData: JSON.stringify(eventData),
-    pageSource,
-    extParams: JSON.stringify(wrapObject(extParams))
-  })
+    const res: any = wrapData({
+        logType,
+        eventId,
+        eventData: JSON.stringify(eventData),
+        pageSource,
+        extParams: JSON.stringify(wrapObject(extParams))
+    })
 
-  uploadLogFromFrontend(res)
+    uploadLogFromFrontend(res)
 }
 
 function uploadLogFromFrontend(params) {
-  const data = createBaseInfoToFetchData(params)
-  request(uploadLogFromFrontendUrl, data, {
-    headers: {
-      'content-type': 'application/json',
-    },
-    method: 'POST'
-  })
+    const data = createBaseInfoToFetchData(params)
+    request(uploadLogFromFrontendUrl, data, {
+        headers: {
+            'content-type': 'application/json',
+        },
+        method: 'POST'
+    })
 }
 
 function request(url, data, config) {
-  Taro.request({
-    url,
-    data,
-    ...config
-  })
+    Taro.request({
+        url,
+        data,
+        ...config
+    })
 }
 
 function wrapObject(extParams) {
-  if (typeDecide(extParams, 'Object')) {
-      return extParams
-  }
-  return { defaultExt: extParams }
+    if (typeDecide(extParams, 'Object')) {
+        return extParams
+    }
+    return { defaultExt: extParams }
 }
 
 /**
 * 检测对象类型
 */
 function typeDecide(o, type) {
-  return Object.prototype.toString.call(o) === `[object ${type}]`
+    return Object.prototype.toString.call(o) === `[object ${type}]`
 }

src/pages/category/index.config.ts

@@ -1,5 +1,5 @@
 export default definePageConfig({
-  navigationBarTitleText: '首页',
-  navigationStyle: 'custom',
-  usingComponents: {},
+    navigationBarTitleText: '首页',
+    navigationStyle: 'custom',
+    usingComponents: {},
 })

src/pages/category/index.tsx

@@ -1,12 +1,14 @@
 import Taro, { useLoad, useDidShow, useReady, useDidHide, usePullDownRefresh, useShareAppMessage, useRouter } from '@tarojs/taro'
-import { useMemo, useRef, useState } from 'react'
+import { useMemo, useState } from 'react'
 import type CustomTabBar from '@/custom-tab-bar'
 import { View } from '@tarojs/components'
 import { VideoInfo } from '@/constants/commentTypes'
 import { videoListV2 } from '@/http/api'
 import VideoSwiper from '@/components/VideoSwiper'
-import { sharePageAppMessage, returnedCrowdClickReport } from '@/shareHelper'
+import { sharePageAppMessage } from '@/shareHelper'
 import Route from '@/class/Route'
+import { filterCardProps } from '@/utils/index'
+import { CATEGORY_PAGESOURCE } from '@/const/index'
 
 // import { getTopSafeHeight, throttle, formatSecondsAsTime, getPreIds } from '@/utils'
 
@@ -14,9 +16,6 @@ import Route from '@/class/Route'
 import './index.less'
 
 let pageNo = 1
-let pending = false
-let start = -1
-let end = 1
 let activeIndex = 0
 
 export default function Index() {
@@ -27,7 +26,8 @@ export default function Index() {
     const [videoList, setVideoList] = useState<VideoInfo[]>([])
     const [refresherTriggered, setRefresherTriggered] = useState(false)
     const [needResumePlay, setNeedResumePlay] = useState(false)
-    const [ toSharePage, setToSharePage] = useState(false)
+    const [toSharePage, setToSharePage] = useState(false)
+    const [flushList, setFlushList] = useState(false)
 
     useLoad(() => {
         const { redirect } = params
@@ -38,6 +38,7 @@ export default function Index() {
             dur = 1000
             setToSharePage(true)
         }
+
         setTimeout(() => {
             fecthVideoListV2()
         }, dur);
@@ -66,10 +67,10 @@ export default function Index() {
 
     useShareAppMessage((shareRes) => {
         return sharePageAppMessage({
-          video: videoList[activeIndex],
-          activeIndex,
-          router,
-          shareRes
+            video: videoList[activeIndex],
+            activeIndex,
+            router,
+            shareRes
         })
     })
 
@@ -99,47 +100,22 @@ export default function Index() {
 
             setVideoList([
                 ...oldCardList,
-                ...filterCardProps(data)
+                ...filterCardProps(data, CATEGORY_PAGESOURCE)
             ])
+            if (cleanOldCardList) {
+                setFlushList(true)
+                setTimeout(() => {
+                    setFlushList(false)
+                }, 300);
+            }
 
         }).catch(() => {
-            pending = false
         })
     }
 
-    function pause() {
-        console.log('hhz-')
-    }
-
-    // 视频卡片需要参数过滤重组一次，并不需要把所有的数据都传进去
-    function filterCardProps(list) {
-        return list.map((item: RoughCardType) => {
-            const {
-                title, coverImg, user, id, videoPath,
-                recomTraceId, flowPool, shareTitle = ''
-            } = item || {}
-            const { coverImgPath = '' } = coverImg || {}
-            const { avatarUrl = '', nickName = '', uid = 0 } = user || {}
-
-            return {
-                id,
-                title,
-                coverImgPath,
-                shareTitle,
-                videoPath,
-                recomTraceId,
-                flowPool,
-                user: {
-                    uid,
-                    avatarUrl,
-                    nickName,
-                }
-            }
-        })
-    }
 
     function onAnimationFinish(current) {
-        if (current == -99){
+        if (current == -99) {
             fecthVideoListV2(true)
 
             return
@@ -155,6 +131,7 @@ export default function Index() {
         <View className='category-page'>
             <VideoSwiper
                 list={videoList}
+                flushList={flushList}
                 needResumePlay={needResumePlay}
                 onFinish={onAnimationFinish}
             />

src/pages/home/home.config.ts

@@ -1,4 +1,5 @@
 export default definePageConfig({
-  navigationBarTitleText: '个人主页',
-  usingComponents: {},
+    navigationBarTitleText: '个人主页',
+    navigationStyle: 'custom',
+    usingComponents: {},
 })

src/pages/home/home.less

@@ -0,0 +1,54 @@
+.home-page {
+
+    background-color: black;
+    width: 100%;
+    height: calc(100% - 110px);
+    position: absolute;
+    top: 0;
+
+
+    .head-bg {
+        position: absolute;
+        width: 100%;
+        height: 340px;
+
+        .baseInfo {
+            position: absolute;
+            bottom: 0;
+            width: 100%;
+            display: flex;
+            align-items: center;
+
+            image {
+                width: 128px;
+                height: 128px;
+                margin-left: 48px;
+                border-radius: 50%;
+            }
+
+            .nickName {
+                font-size: 40px;
+                color: white;
+                margin-left: 32px;
+                width: auto;
+            }
+
+            .edit-btn {
+                width: 160px;
+                height: 64px;
+                background-color: #191919;
+                border-radius: 10px;
+                color: #666;
+                font-size: 30px;
+                text-align: center;
+                line-height: 64px;
+                margin-right: 48px;
+                margin-left: auto;
+            }
+        }
+
+
+
+
+    }
+}

src/pages/home/home.tsx

@@ -1,25 +1,47 @@
-import { useMemo } from 'react'
+import { useMemo, useState } from 'react'
 import type CustomTabBar from '../../custom-tab-bar'
-import { View, Text } from '@tarojs/components'
+import { View, Image, Button } from '@tarojs/components'
 import Taro, { useLoad, useDidShow } from '@tarojs/taro'
+import Route from '@/class/Route'
+
+
 import './home.less'
 
-export default function Index() {
-  const page = useMemo(() => Taro.getCurrentInstance().page, [])
+export default function Home() {
+    const page = useMemo(() => Taro.getCurrentInstance().page, [])
+    const [userInfo, setUserInfo] = useState({ avatarUrl: '', nickName: '' })
+
+    useLoad(() => {
+    })
+
+    useDidShow(() => {
+        const tabbar = Taro.getTabBar<CustomTabBar>(page)
+        tabbar?.setSelected(1)
+        
+        setUserInfo(Taro.$global.get('userInfo') || {})
 
-  useLoad(() => {
-    console.log('Page loaded.')
-  })
+    })
 
-  useDidShow(() =>{
-    const tabbar = Taro.getTabBar<CustomTabBar>(page)
-    tabbar?.setSelected(1)
+    function editInfo() {
+        const route = new Route()
+        route.push({
+            url: '/subPackages/my/edit/edit',
+            query: {
+                userInfo: JSON.stringify(userInfo)
+            }
+        })
+    }
 
-  })
+    return (
+        <View className='home-page'>
+            <View className='head-bg'>
+                <View className='baseInfo'>
+                    <Image src={userInfo.avatarUrl}></Image>
+                    <View className='nickName'>{userInfo.nickName}</View>
+                    <View className='edit-btn' onClick={editInfo}>编辑资料</View>
+                </View>
 
-  return (
-    <View className='index'>
-      <Text>Hello world!</Text>
-    </View>
-  )
+            </View>
+        </View>
+    )
 }

src/pages/home/home.wxss

@@ -0,0 +1,43 @@
+.home-page {
+  background-color: black;
+  width: 100%;
+  height: calc(100% - 110px);
+  position: absolute;
+  top: 0;
+}
+.home-page .head-bg {
+  position: absolute;
+  width: 100%;
+  height: 340px;
+}
+.home-page .head-bg .baseInfo {
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  display: flex;
+  align-items: center;
+}
+.home-page .head-bg .baseInfo image {
+  width: 128px;
+  height: 128px;
+  margin-left: 48px;
+  border-radius: 50%;
+}
+.home-page .head-bg .baseInfo .nickName {
+  font-size: 40px;
+  color: white;
+  margin-left: 32px;
+  width: auto;
+}
+.home-page .head-bg .baseInfo .edit-btn {
+  width: 160px;
+  height: 64px;
+  background-color: #191919;
+  border-radius: 10px;
+  color: #666;
+  font-size: 30px;
+  text-align: center;
+  line-height: 64px;
+  margin-right: 48px;
+  margin-left: auto;
+}

src/pages/share/share.config.ts

@@ -1,5 +1,5 @@
 export default definePageConfig({
-  navigationBarTitleText: '分享页',
-  navigationStyle: 'custom',
-  usingComponents: {},
+    navigationBarTitleText: '分享页',
+    navigationStyle: 'custom',
+    usingComponents: {},
 })

src/pages/share/share.less

@@ -11,6 +11,7 @@
         left: 40px;
         width: 80px;
         height: 80px;
+        z-index: 999;
 
         image {
             width: 100%;

src/pages/share/share.tsx

@@ -1,39 +1,50 @@
 import { useState } from 'react'
 import Taro, { useLoad, useDidShow, useReady, useDidHide, usePullDownRefresh, useShareAppMessage, useRouter } from '@tarojs/taro'
-import { View, Text, Image } from '@tarojs/components'
+import { View, Image } from '@tarojs/components'
 import { VideoInfo } from '@/constants/commentTypes'
 import VideoSwiper from "@/components/VideoSwiper";
 import { videoDetail, recommendSharePageList } from '@/http/api'
 import { guid } from '@/utils/index'
 import { USER_SHARE_PAGESOURCE, RECOMMEND_PAGESOURCE } from '@/const/index'
 import './share.less'
+import { filterCardProps } from '@/utils/index'
+import { sharePageAppMessage, returnedCrowdClickReport } from '@/shareHelper'
 
+let flushList = false
+let needResumePlay = false
+
+let activeIndex = 0
 
 export default function Share() {
 
     const router = useRouter()
     const { params } = router || {}
 
-    const [videoList, setVideoList] = useState<any>([{
+    const [videoList, setVideoList] = useState<VideoInfo[]>([{
         id: +params.id!,
         title: decodeURIComponent(params.title || ''),
-        videoCoverSnapshotPath: decodeURIComponent(params.videoCoverSnapshotPath || ''),
+        coverImgPath: decodeURIComponent(params.shareImgPath || ''),
+        shareTitle: decodeURIComponent(params.title || ''),
         videoPath: decodeURIComponent(params.videoPath || ''),
-        avatarUrl: decodeURIComponent(params.avatarUrl || ''),
-        nickName: params.nickName || '',
-        playCount: +params.playCount! || 0,
-        shareImgPath: decodeURIComponent(params.shareImgPath || ''),
-        favorited: params.favorited === 'true',
-        type: 'temp',
-        pageSource: USER_SHARE_PAGESOURCE
+        recomTraceId: '',
+        pageSource: USER_SHARE_PAGESOURCE,
+        flowPool: '',
+        user: {
+            uid: 0,
+            avatarUrl: decodeURIComponent(params.avatarUrl || ''),
+            nickName: params.nickName || '',
+        }
     }])
 
     useLoad(() => {
-        console.log('Page loaded.')
+        console.log('pa', params)
 
         getVideoDetail()
-        getRecommendList()
+        setTimeout(() => {
+            getRecommendList()
+        }, 300);
 
+        returnedCrowdClickReport(params)
     })
 
     useReady(() => {
@@ -49,12 +60,17 @@ export default function Share() {
     })
 
     useShareAppMessage((shareRes) => {
-
-        return {}
+        return sharePageAppMessage({
+            video: videoList[activeIndex],
+            activeIndex,
+            router,
+            shareRes
+        })
     })
 
     function getVideoDetail() {
         let { id } = params
+        console.log('share detail: ', Date.now())
 
         Taro.$http.post(videoDetail, {
             videoId: id,
@@ -74,10 +90,8 @@ export default function Share() {
                 return
             }
 
-            let video = formatVideoDetail(data)
-            video.pageSource = USER_SHARE_PAGESOURCE
-            setVideoList([video])
-
+            let videos = filterCardProps([data], USER_SHARE_PAGESOURCE)
+            setVideoList(videos)
         })
     }
 
@@ -92,65 +106,40 @@ export default function Share() {
                 if (code != 0) {
                     return
                 }
-                let oldCardList = videoList
-
-                const recomList = data.map(item => {
-                    let video = formatVideoDetail(item)
-                    video.pageSource = RECOMMEND_PAGESOURCE
-
-                    return video
-                })
-
-                setVideoList({
-                    ...oldCardList,
+                const recomList : VideoInfo[] = filterCardProps(data, RECOMMEND_PAGESOURCE)
+                setVideoList([
+                    ...videoList,
                     ...recomList
-                })
+                ])
             })
 
     }
 
-    function onAnimationFinished(){
+    function onAnimationFinish(current) {
+        if (current == -99) {
+            // fecthVideoListV2(true)
 
+            return
+        }
+        activeIndex = current
+        if (current >= videoList.length - 4) {
+            getRecommendList()
+        }
     }
-    function backBtnAction(){
+    function backBtnAction() {
         Taro.navigateBack()
     }
 
     return (
         <View className='share-page'>
             <View className='backBtn' onClick={backBtnAction}>
-                <Image src='https://weapppiccdn.yishihui.com/wxicon/common/ad_cover_back.png'/>
+                <Image src='https://weapppiccdn.yishihui.com/wxicon/common/share_backbtn.png' />
             </View>
-            {/* <VideoSwiper list={videoList} onFinish={onAnimationFinished}/> */}
-            <Text>Hello world!</Text>
+            <VideoSwiper
+                list={videoList}
+                onFinish={onAnimationFinish}
+                needResumePlay={needResumePlay}
+                flushList={flushList} />
         </View>
     )
 }
-
-// 尽量不在组件间传输大量不用的数据
-function formatVideoDetail(detail) {
-    const {
-        videoPath, id, videoCoverSnapshotPath,
-        title, user, playCount, shareImgPath,
-        favorited, recomTraceId, flowPool,
-        measure, measureType, recommendLogVO,
-        recommendSource, uid, shareImgId,
-        titleId, isRecommendShare, transcodeStatus,
-        shareLinkType, rotate, sharePageType, pageSource = ''
-    } = detail
-    const { avatarUrl, nickName } = user
-
-    return {
-        videoPath, id, videoCoverSnapshotPath,
-        title, avatarUrl, nickName, playCount,
-        shareImgPath, favorited, recomTraceId,
-        flowPool, measure, measureType,
-        recommendLogVO, recommendSource,
-        playId: `${guid()}-${id}`,
-        viewId: `view-${new Date().getTime()}-${guid()}`,
-        uid, shareImgId, titleId, isRecommendShare,
-        transcodeStatus, shareLinkType, rotate,
-        sharePageType,
-        pageSource
-    }
-}

src/pages/share/share.wxss

@@ -11,6 +11,7 @@
   left: 40px;
   width: 80px;
   height: 80px;
+  z-index: 999;
 }
 .share-page .backBtn image {
   width: 100%;

src/shareHelper/index.ts

@@ -6,146 +6,118 @@ import { shareReport, weixinFriend, shareClickReport } from '@/logger'
 import { USER_SENCE } from '@/const/index'
 
 export function sharePageAppMessage({ video, activeIndex, router, shareRes }) {
-  useHotLaunch.valid = false
-  const { path, params } = router
-  const launchOption = Taro.$global.get('launchOption')
-  const { target } = shareRes || {}
-  const { dataset } = target || {}
-
-  return shareVideoToWechat({
-    path,
-    video,
-    pageSource: USER_SHARE_PAGESOURCE,
-    recommendPageType: RECOMMEND_PAGESOURCE,
-    parentRootPageSource: CATEGORY_PAGESOURCE,
-
-    rootPageSource: params.rootPageSource,
-    shareDepth: params.shareDepth,
-    rootPageTimestamp: params.rootPageTimestamp,
-    rootShareId: params.rootShareId,
-    rootMid: params.rootMid,
-    rootLaunchShareId: params.rootLaunchShareId,
-    parentEventIds: params.eventIds,
-
-    actionPosition: activeIndex,
-    scene: launchOption.scene,
-    shareButtonType: dataset?.buttonType || 0,
-    prePageSource: '',
-    userSence: params.userSence
-  })
+    useHotLaunch.valid = false
+    const { path, params } = router
+    const launchOption = Taro.$global.get('launchOption')
+    const { target } = shareRes || {}
+    const { dataset } = target || {}
+
+    return shareVideoToWechat({
+        path,
+        video,
+        pageSource: USER_SHARE_PAGESOURCE,
+        recommendPageType: RECOMMEND_PAGESOURCE,
+        parentRootPageSource: CATEGORY_PAGESOURCE,
+
+        rootPageSource: params.rootPageSource,
+        shareDepth: params.shareDepth,
+        rootPageTimestamp: params.rootPageTimestamp,
+        rootShareId: params.rootShareId,
+        rootMid: params.rootMid,
+        rootLaunchShareId: params.rootLaunchShareId,
+        parentEventIds: params.eventIds,
+
+        actionPosition: activeIndex,
+        scene: launchOption.scene,
+        shareButtonType: dataset?.buttonType || 0,
+        prePageSource: '',
+        userSence: params.userSence
+    })
 }
 
 export function shareVideoToWechat(params) {
-  const { video } = params
-  const mid = Taro.$global.get('mid')
-  const shareId = mid + '-' + S4() + new Date().getTime()
-
-  // TODO: 处理 pagesource
-  let pageSource = video.head ? USER_SHARE_PAGESOURCE : RECOMMEND_PAGESOURCE
-
-  if (params.userSence !== USER_SENCE.share)
-    pageSource = video.head ? DETAIL_PAGESOURCE : DETAIL_RECOMMEND
-
-  const userInfo = Taro.$global.get('userInfo')
-
-  const query = {
-      userSence: USER_SENCE.share,
-      mid: mid,
-      rootMid: params.rootMid || mid,
-      shareId,
-      pageSource,
-      rootPageSource: params.rootPageSource || pageSource,
-      measureType: video.measureType,
-      measureId: video.measure,
-      flowPool: video.flowPool || '',
-      launchscene:params.scene,
-      su: userInfo.uid,
-
-      parentShareId: params.parentShareId || shareId,
-      rootPageTimestamp: params.rootPageTimestamp || new Date().getTime(),
-      rootLaunchShareId: params.rootLaunchShareId || shareId,
-      rootShareId: params.rootShareId || shareId,
-      rootSharePageType: video.sharePageType,
-
-      viewId: video.viewId,
-      playId: video.playId,
-      shareDepth:  +params.shareDepth + 1 || 0,
-      isRecommendShare: video.isRecommendShare,
-      recommendSource: video.recommendSource,
-      recommendLogVO: video.recommendLogVO || '{}',
-      parentRootPageSource: params.parentRootPageSource || params.rootPageSource,
-      shareImageId: video.shareImgId,
-      shareTitleId: video.titleId,
-      shareButtonType: params.shareButtonType, // 按钮类型
-      videoReuseData: JSON.stringify({
-          id: video.id || 0,
-          width: video.width,
-          height: video.height,
-          rotate: video.rotate,
-          videoPath: video.videoPath.replace(/\?/g, '+++').replace(/=/g, '---') || '',
-          transcodeStatus: video.transcodeStatus,
-          recommendSource: video.recommendSource || 0,
-          measureId: video.measure || '',
-          measureType: video.measureType || 0,
-          user: { uid: video.uid || 0 }
-      }),
-      ...videoPlayParams(video)
-  }
-
-  const detailPath = `/pages/share/share?${stringify(query)}`
-
-  shareReport(query)
-  weixinFriend(query)
-
-  return {
-    title: video.title || '好友分享给你一个视频，点击查看～',
-    imageUrl: video.shareImgPath,
-    path: `/pages/category/index?redirect=${encodeURIComponent(detailPath)}`
-  }
+    const { video } = params
+    const mid = Taro.$global.get('mid')
+    const shareId = mid + '-' + S4() + new Date().getTime()
+
+    // TODO: 处理 pagesource
+    let pageSource = video.head ? USER_SHARE_PAGESOURCE : RECOMMEND_PAGESOURCE
+
+    if (params.userSence !== USER_SENCE.share)
+        pageSource = video.head ? DETAIL_PAGESOURCE : DETAIL_RECOMMEND
+
+    const userInfo = Taro.$global.get('userInfo')
+
+    const query = {
+        userSence: USER_SENCE.share,
+        mid: mid,
+        rootMid: params.rootMid || mid,
+        shareId,
+        pageSource,
+        rootPageSource: params.rootPageSource || pageSource,
+        flowPool: video.flowPool || '',
+        launchscene: params.scene,
+        su: userInfo.uid,
+        recomTraceId: video.recomTraceId || '',
+        rootPageTimestamp: params.rootPageTimestamp || new Date().getTime(),
+        rootShareId: params.rootShareId || shareId,
+
+        shareDepth: +params.shareDepth + 1 || 0,
+        isRecommendShare: video.isRecommendShare,
+        recommendSource: video.recommendSource,
+        recommendLogVO: video.recommendLogVO || '{}',
+        shareImageId: video.shareImgId,
+        shareTitleId: video.titleId,
+        shareButtonType: params.shareButtonType, // 按钮类型
+        ...videoPlayParams(video)
+    }
+
+    const detailPath = `/pages/share/share?${stringify(query)}`
+
+    shareReport(query)
+    weixinFriend(query)
+
+    return {
+        title: video.title || '好友分享给你一个视频，点击查看～',
+        imageUrl: video.shareImgPath,
+        path: `/pages/category/index?redirect=${encodeURIComponent(detailPath)}`
+    }
 }
 
 function videoPlayParams(video) {
-  const {
-    id, title, shareImgPath,
-    videoCoverSnapshotPath, videoPath,
-    playCount, favorited, user
-  } = video
-  let {nickName, avatarUrl} = user
-
-  return {
-    title: encodeURIComponent(title || ''),
-    videoCoverSnapshotPath: encodeURIComponent(videoCoverSnapshotPath),
-    videoPath: encodeURIComponent(videoPath),
-    id,
-    avatarUrl: encodeURIComponent(avatarUrl),
-    playCount,
-    nickName,
-    shareImgPath: encodeURIComponent(shareImgPath),
-    favorited
-  }
+    const {
+        id, title, shareImgPath, videoPath,
+    } = video
+
+    return {
+        title: encodeURIComponent(title || ''),
+        videoPath: encodeURIComponent(videoPath),
+        id,
+        shareImgPath: encodeURIComponent(shareImgPath)
+    }
 }
 
 // 分享回流上报
 export function returnedCrowdClickReport(params) {
-  if (params.userSence !== USER_SENCE.share)
-    return
-
-  shareClickReport({
-    shareId: params.shareId,
-    clickObjectId: params.id || 0,
-    pageSource: params.pageSource,
-    rootPageSource: params.rootPageSource,
-    shareButtonType: params.shareButtonType,
-    shareDepth: params.shareDepth || 1,
-    rootLaunchShareId: params.rootLaunchShareId || '',
-    rootShareId: params.rootShareId || '',
-    shareTitle: params.title,
-    shareImageUrl: params.shareImgPath,
-    shareTitleId: params.shareTitleId,
-    shareImageId: params.shareImageId,
-    parentShareId: params.parentShareId,
-    extJson: JSON.stringify({
-        parentRootPageSource: params.parentRootPageSource || params.rootPageSource,
+    if (params.userSence !== USER_SENCE.share)
+        return
+
+    shareClickReport({
+        shareId: params.shareId,
+        clickObjectId: params.id || 0,
+        pageSource: params.pageSource,
+        rootPageSource: params.rootPageSource,
+        shareButtonType: params.shareButtonType,
+        shareDepth: params.shareDepth || 1,
+        rootLaunchShareId: params.rootLaunchShareId || '',
+        rootShareId: params.rootShareId || '',
+        shareTitle: params.title,
+        shareImageUrl: params.shareImgPath,
+        shareTitleId: params.shareTitleId,
+        shareImageId: params.shareImageId,
+        parentShareId: params.parentShareId,
+        extJson: JSON.stringify({
+            parentRootPageSource: params.parentRootPageSource || params.rootPageSource,
+        })
     })
-  })
 }

src/store/features/counter.ts

@@ -1,30 +1,30 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 
 interface CounterState {
-  value: number
+    value: number
 }
 
 const initialState: CounterState = {
-  value: 0
+    value: 0
 }
 
 export const counterSlice = createSlice({
-  name: 'counter',
-  initialState,
-  reducers: {
-    increment: state => {
-      console.log('increment')
-      state.value += 1
+    name: 'counter',
+    initialState,
+    reducers: {
+        increment: state => {
+            console.log('increment')
+            state.value += 1
+        },
+        decrement: state => {
+            console.log('decrement')
+            state.value -= 1
+        },
+        incrementByAmount: (state, action: PayloadAction<number>) => {
+            console.log('incrementByAmount')
+            state.value += action.payload
+        },
     },
-    decrement: state => {
-      console.log('decrement')
-      state.value -= 1
-    },
-    incrementByAmount: (state, action: PayloadAction<number>) => {
-      console.log('incrementByAmount')
-      state.value += action.payload
-    },
-  },
 })
 
 export const { increment, decrement, incrementByAmount } = counterSlice.actions

src/store/index.ts

@@ -2,9 +2,9 @@ import { configureStore } from '@reduxjs/toolkit'
 import counterReducer from './features/counter'
 
 const store = configureStore({
-  reducer: {
-    counter: counterReducer
-  }
+    reducer: {
+        counter: counterReducer
+    }
 })
 
 export type RootState = ReturnType<typeof store.getState>

src/subPackages/my/compent_tmp/edit.config.ts

@@ -0,0 +1,6 @@
+export default definePageConfig({
+    navigationStyle: 'default',
+    navigationBarBackgroundColor: '#fff',
+    navigationBarTextStyle: 'white',
+    navigationBarTitleText: '编辑个人资料'
+  })

src/subPackages/my/compent_tmp/edit.less

@@ -0,0 +1 @@
+// 

src/subPackages/my/compent_tmp/edit.tsx

@@ -0,0 +1,27 @@
+/*
+ * @Author: harry
+ * @Date: 2024-02-22 16:54:05
+ * @LastEditors: harry
+ * @LastEditTime: 2024-02-22 17:00:35
+ * @FilePath: /pq-video-mp/src/subPackages/my/edit/edit.tsx
+ * @Description: 
+ */
+
+import { Component, useState } from 'react'
+import Taro, { useLoad, useRouter } from '@tarojs/taro'
+import { View, Textarea, Button } from "@tarojs/components"
+import './edit.less'
+
+class Edit extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {};
+    }
+    render(){
+        return <View>
+
+        </View>
+    }
+}
+
+export default Edit;

src/subPackages/my/edit/edit.config.ts

@@ -0,0 +1,6 @@
+export default definePageConfig({
+    // 兼容 skyline 不要删除
+    disableScroll: true,
+    navigationStyle: 'custom',
+    navigationBarTextStyle: 'black',
+})

src/subPackages/my/edit/edit.less

@@ -0,0 +1,48 @@
+page {
+    background: #F1F1F1;
+}
+
+.user-page {
+
+    .avatar-setting,
+    .nickname-setting {
+        box-sizing: border-box;
+        padding: 0 40px;
+        background: #fff;
+        height: 100px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        font-size: 28px;
+        color: #666;
+
+        .right {
+            display: flex;
+            align-items: center;
+        }
+    }
+
+    .avatar-setting {
+        image {
+            width: 60px;
+            height: 60px;
+            border-radius: 50%;
+        }
+    }
+
+    .nickname-setting {
+        .right {
+            color: #999
+        }
+    }
+
+    .arrow {
+        height: 14px;
+        width: 14px;
+        border-width: 2px 2px 0 0;
+        border-color: #7c7b7b;
+        border-style: solid;
+        transform: matrix(0.71, 0.71, -.71, 0.71, 0, 0);
+        margin-left: 40px;
+    }
+}

src/subPackages/my/edit/edit.tsx

@@ -0,0 +1,76 @@
+/*
+ * @Author: harry
+ * @Date: 2024-02-07 19:22:58
+ * @LastEditors: harry
+ * @LastEditTime: 2024-02-22 19:35:20
+ * @FilePath: /pq-video-mp/src/subPackages/my/edit/edit.tsx
+ * @Description: 
+ */
+import { useState } from 'react'
+import Taro, { useDidShow } from '@tarojs/taro'
+import { View, Image } from "@tarojs/components"
+import { getHomepageHead } from '@/http/api'
+import Navbar from '@/components/Navbar'
+import Route from '@/class/Route'
+import './edit.less'
+
+function Edit() {
+    const [homepageHead, setHomepageHead] = useState<any>({})
+
+    function setUserInfo(type) {
+        const route = new Route()
+
+        route.push({
+            url: '/subPackages/my/edit/editUpload',
+            query: {
+                avatarUrl: encodeURIComponent(homepageHead.avatarUrl),
+                nickName: homepageHead.nickName,
+                type
+            }
+        })
+    }
+
+    useDidShow(() => {
+        fetchHomepageHead()
+    })
+
+    function fetchHomepageHead() {
+        const userInfo = Taro.getStorageSync('$USER_INFO')
+        const { uid } = userInfo || {}
+
+        Taro.$http.post(getHomepageHead, {
+            targetUid: uid
+        }).then((res: RequestType) => {
+            const { code, data } = res
+            if (code !== 0)
+                return
+
+            setHomepageHead(data)
+            Object.assign(userInfo, data)
+            Taro.$global.set('userInfo', userInfo)
+            Taro.setStorageSync('$USER_INFO', userInfo)
+        })
+    }
+
+    return (
+        <View className='user-page'>
+            <Navbar title="编辑个人资料" status navigation />
+            <View className='avatar-setting' onClick={() => setUserInfo('avatar')}>
+                <View className='avatar'>头像</View>
+                <View className='right'>
+                    <Image src={homepageHead.avatarUrl} />
+                    <View className='arrow'></View>
+                </View>
+            </View>
+            <View className='nickname-setting' onClick={() => setUserInfo('nickname')}>
+                <View className='nickname'>昵称</View>
+                <View className='right'>
+                    {homepageHead.nickName}
+                    <View className='arrow'></View>
+                </View>
+            </View>
+        </View>
+    )
+}
+
+export default Edit

src/subPackages/my/edit/edit.wxss

@@ -0,0 +1,37 @@
+page {
+  background: #F1F1F1;
+}
+.user-page .avatar-setting,
+.user-page .nickname-setting {
+  box-sizing: border-box;
+  padding: 0 40px;
+  background: #fff;
+  height: 100px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  font-size: 28px;
+  color: #666;
+}
+.user-page .avatar-setting .right,
+.user-page .nickname-setting .right {
+  display: flex;
+  align-items: center;
+}
+.user-page .avatar-setting image {
+  width: 60px;
+  height: 60px;
+  border-radius: 50%;
+}
+.user-page .nickname-setting .right {
+  color: #999;
+}
+.user-page .arrow {
+  height: 14px;
+  width: 14px;
+  border-width: 2px 2px 0 0;
+  border-color: #7c7b7b;
+  border-style: solid;
+  transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
+  margin-left: 40px;
+}

src/subPackages/my/edit/editUpload.config.ts

@@ -0,0 +1,7 @@
+export default definePageConfig({
+    // 兼容 skyline 不要删除
+    renderer: 'webview',
+    disableScroll: true,
+    navigationStyle: 'custom',
+    navigationBarTextStyle: 'black'
+})

src/subPackages/my/edit/editUpload.less

@@ -0,0 +1,85 @@
+page {
+    background: #F1F1F1;
+}
+
+.user-setting-page {
+    .avatar {
+        width: 100vw;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-direction: column;
+
+        .outer-box {
+            width: 100%;
+            height: auto;
+            position: relative;
+            overflow: hidden;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            image {
+                width: 100%;
+            }
+
+            .mask {
+                width: 100%;
+                height: 100%;
+                border: 200px solid rgba(0, 0, 0, .35);
+                border-radius: 50%;
+                position: absolute;
+                left: 50%;
+                top: 50%;
+                transform: translate(-50%, -50%);
+            }
+        }
+
+        .operation {
+            display: flex;
+            justify-content: space-around;
+
+            .save-avatar,
+            .update-avatar {
+                background: #55c57c;
+                color: #fff;
+                width: 200px;
+                height: 60px;
+                border-radius: 4px;
+                line-height: 60px;
+                text-align: center;
+                margin-top: 40px;
+                font-size: 24px;
+            }
+
+            .update-avatar {
+                margin-right: 40px;
+            }
+        }
+    }
+
+    .username {
+        input {
+            background: #fff;
+            padding: 20px;
+        }
+
+        .tips {
+            padding: 20px 40px;
+            font-size: 24px;
+            color: #999;
+        }
+
+        .save-btn {
+            background: #55c57c;
+            color: #fff;
+            width: 280px;
+            height: 60px;
+            border-radius: 4px;
+            line-height: 60px;
+            text-align: center;
+            margin-top: 80px;
+            font-size: 24px;
+        }
+    }
+}

src/subPackages/my/edit/editUpload.tsx

@@ -0,0 +1,156 @@
+import { useState } from 'react'
+import Taro, { useRouter } from '@tarojs/taro'
+import Navbar from '@/components/Navbar'
+import { View, Image, Button, Input } from '@tarojs/components'
+import { getTopSafeHeight, mediaRotate, squaredImageUrl, filterCoverPath } from '@/utils'
+import { uploadImageFile } from '@/utils/oss'
+import { userInfoUpdateUrl } from '@/http/api'
+import './editUpload.less'
+
+type UploadFileResultType = {
+    fileUrl: string
+    objectKey: string
+    host: string
+    relativeUrl: string
+}
+
+function editUpload() {
+    const { params } = useRouter()
+    const avatarUrl = decodeURIComponent(params.avatarUrl || '')
+    const title = params.type === 'avatar' ? '设置头像' : '设置昵称'
+    const navigationColor = params.type === 'avatar' ? '#fff' : ''
+    const textColor = params.type === 'avatar' ? '#fff' : '#000'
+
+    return (
+        <View className='user-setting-page' style={{
+            background: params.type === 'avatar' ? '#000' : ''
+        }}>
+            <Navbar title={title} navigationColor={navigationColor} textColor={textColor} status navigation />
+            {params.type === 'avatar' && <Avatar avatarUrl={avatarUrl} nickName={params.nickName} />}
+            {params.type === 'nickname' && <UserName avatarUrl={avatarUrl} nickName={params.nickName} />}
+        </View>
+    )
+}
+
+function Avatar({ avatarUrl, nickName }) {
+    const [avatar, setAvatarUrl] = useState(avatarUrl)
+    const { statusBarHeight, navigationBarHeight } = getTopSafeHeight()
+    const style = {
+        height: `calc(100vh - ${statusBarHeight + navigationBarHeight}px)`
+    }
+
+    function onChooseAvatar(res) {
+        const { detail } = res
+        const { avatarUrl } = detail || {}
+
+        Taro.getImageInfo({
+            src: avatarUrl,
+            success(res) {
+                updateUserSetting(res)
+            }
+        })
+    }
+
+    function updateUserSetting(imageInfo) {
+        const { path } = imageInfo
+
+        uploadImageFile({
+            tempFilePath: path
+        }).then((res: UploadFileResultType) => {
+            const { relativeUrl, host } = res
+            const rotate = mediaRotate(imageInfo.orientation)
+            const width = Math.min(Math.min(imageInfo.width, imageInfo.height), 4000)
+            const squared = squaredImageUrl(relativeUrl, rotate, width)
+            const fullSquaredUrl = filterCoverPath(host + squared)
+            setAvatarUrl(fullSquaredUrl)
+
+            Taro.showToast({
+                title: '上传成功',
+                icon: 'success'
+            })
+        }).catch(() => {
+            Taro.showToast({
+                title: '上传失败',
+                icon: 'error'
+            })
+        })
+    }
+
+    function saveAvatar() {
+        Taro.$http.post(userInfoUpdateUrl, {
+            avatarUrl: avatar,
+            nickName
+        }).then((res: RequestType) => {
+            const { code } = res
+            if (code !== 0) {
+                Taro.showToast({
+                    title: '修改失败',
+                    icon: 'error'
+                })
+                return
+            }
+
+            Taro.showToast({
+                title: '修改成功'
+            })
+        })
+    }
+
+    return (
+        <View className='avatar' style={style}>
+            <View className='outer-box'>
+                <Image src={avatar} mode='widthFix' />
+                <View className='mask'></View>
+            </View>
+
+            <View className='operation'>
+                <Button className='update-avatar' openType='chooseAvatar' onChooseAvatar={onChooseAvatar}>
+                    更换头像
+                </Button>
+
+                <Button className='save-avatar' onClick={saveAvatar}>
+                    保存头像
+                </Button>
+            </View>
+        </View>
+    )
+}
+
+function UserName({ avatarUrl, nickName }) {
+    const [name, setName] = useState(nickName)
+    function onInput(res) {
+        const { detail } = res
+        const { value } = detail
+        setName(value)
+    }
+
+    function saveName() {
+        Taro.$http.post(userInfoUpdateUrl, {
+            avatarUrl,
+            nickName: name
+        }).then((res: RequestType) => {
+            const { code } = res
+            if (code !== 0) {
+                Taro.showToast({
+                    title: '修改失败',
+                    icon: 'error'
+                })
+                return
+            }
+
+            Taro.showToast({
+                title: '修改成功'
+            })
+        })
+    }
+
+    return (
+        <View className='username'>
+            <Input value={name} onInput={onInput} maxlength={50} />
+            <View className='tips'>修改昵称，最多50个字</View>
+            <Button className='save-btn' onClick={saveName}>保存</Button>
+        </View>
+    )
+}
+
+export default editUpload

src/subPackages/my/edit/editUpload.wxss

@@ -0,0 +1,71 @@
+page {
+  background: #F1F1F1;
+}
+.user-setting-page .avatar {
+  width: 100vw;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+}
+.user-setting-page .avatar .outer-box {
+  width: 100%;
+  height: auto;
+  position: relative;
+  overflow: hidden;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.user-setting-page .avatar .outer-box image {
+  width: 100%;
+}
+.user-setting-page .avatar .outer-box .mask {
+  width: 100%;
+  height: 100%;
+  border: 200px solid rgba(0, 0, 0, 0.35);
+  border-radius: 50%;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+.user-setting-page .avatar .operation {
+  display: flex;
+  justify-content: space-around;
+}
+.user-setting-page .avatar .operation .save-avatar,
+.user-setting-page .avatar .operation .update-avatar {
+  background: #55c57c;
+  color: #fff;
+  width: 200px;
+  height: 60px;
+  border-radius: 4px;
+  line-height: 60px;
+  text-align: center;
+  margin-top: 40px;
+  font-size: 24px;
+}
+.user-setting-page .avatar .operation .update-avatar {
+  margin-right: 40px;
+}
+.user-setting-page .username input {
+  background: #fff;
+  padding: 20px;
+}
+.user-setting-page .username .tips {
+  padding: 20px 40px;
+  font-size: 24px;
+  color: #999;
+}
+.user-setting-page .username .save-btn {
+  background: #55c57c;
+  color: #fff;
+  width: 280px;
+  height: 60px;
+  border-radius: 4px;
+  line-height: 60px;
+  text-align: center;
+  margin-top: 80px;
+  font-size: 24px;
+}

src/subPackages/safe/complaining/index.config.ts

@@ -1,7 +1,7 @@
 export default definePageConfig({
-  renderer: 'webview',
-  navigationStyle: 'default',
-  navigationBarBackgroundColor: '#fff',
-  navigationBarTextStyle: 'black',
-  navigationBarTitleText: '投诉'
+    renderer: 'webview',
+    navigationStyle: 'default',
+    navigationBarBackgroundColor: '#fff',
+    navigationBarTextStyle: 'black',
+    navigationBarTitleText: '投诉'
 })

src/subPackages/safe/complaining/index.less

@@ -1,54 +1,53 @@
 .complaining-page {
-  .complaining-comment {
-    text-align: center;
-    padding: 20px 0;
-    font-size: 24px;
-    color: #999;
-  }
+    .complaining-comment {
+        text-align: center;
+        padding: 20px 0;
+        font-size: 24px;
+        color: #999;
+    }
 
-  .reason {
-    box-sizing: border-box;
-    width: 100%;
-    height: 80px;
-    display: flex;
-    align-items: center;
-    padding: 0 40px;
-    font-size: 28px;
-    color: #333;
-    border-bottom: 2px solid #f7f7f7; 
-  }
+    .reason {
+        box-sizing: border-box;
+        width: 100%;
+        height: 80px;
+        display: flex;
+        align-items: center;
+        padding: 0 40px;
+        font-size: 28px;
+        color: #333;
+        border-bottom: 2px solid #f7f7f7;
+    }
 
-  .other-reason {
-    width: 100%;
-    margin-top: 20px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 24px;
-    flex-direction: column;
+    .other-reason {
+        width: 100%;
+        margin-top: 20px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 24px;
+        flex-direction: column;
 
-    textarea {
-      border: 1px solid #f2f2f2;
-      padding: 10px;
-      background: #f9f9f9;
-      height: 100px;
-    }
+        textarea {
+            border: 1px solid #f2f2f2;
+            padding: 10px;
+            background: #f9f9f9;
+            height: 100px;
+        }
 
-    .placeholder-class {
-      font-size: 24px;
-      color: #999;
-    }
+        .placeholder-class {
+            font-size: 24px;
+            color: #999;
+        }
 
-    .submit {
-      width: 200px;
-      height: 60px;
-      text-align: 60px;
-      font-size: 26px;
-      background: #55c57c;
-      color: #fff;
-      border: 0;
-      margin-top: 20px;
+        .submit {
+            width: 200px;
+            height: 60px;
+            text-align: 60px;
+            font-size: 26px;
+            background: #55c57c;
+            color: #fff;
+            border: 0;
+            margin-top: 20px;
+        }
     }
-  }
-}
-
+}

src/subPackages/safe/complaining/index.tsx

@@ -5,104 +5,104 @@ import { reasonList, videoReport } from '@/http/api/index'
 import './index.less'
 
 function Complaining() {
-  let reason = ''
-  const { params } = useRouter()
-  const { videoId } = params
-  const [list, setList] = useState([])
-  const [showOtherReason, setShowOtherReason] = useState(false)
-  useLoad(() => {
-    fetchList()
-  })
-
-  function fetchList() {
-    Taro.$http.post(reasonList).then((res: RequestType) => {
-      const { code, data } = res
-      if (code !== 0)
-        return
-
-      const reasons = data.reduce((calc, cur) => {
-        return calc.concat(cur.reasons)
-      }, [])
-
-      setList(reasons)
+    let reason = ''
+    const { params } = useRouter()
+    const { videoId } = params
+    const [list, setList] = useState([])
+    const [showOtherReason, setShowOtherReason] = useState(false)
+    useLoad(() => {
+        fetchList()
     })
-  }
 
-  function onClick(item, index) {
-    if (list.length - 1 === index) {
-      setShowOtherReason(true)
-      return
-    }
+    function fetchList() {
+        Taro.$http.post(reasonList).then((res: RequestType) => {
+            const { code, data } = res
+            if (code !== 0)
+                return
 
-    showOtherReason && setShowOtherReason(false)
+            const reasons = data.reduce((calc, cur) => {
+                return calc.concat(cur.reasons)
+            }, [])
 
-    reason = item
+            setList(reasons)
+        })
+    }
 
-    onSubmit()
-  }
+    function onClick(item, index) {
+        if (list.length - 1 === index) {
+            setShowOtherReason(true)
+            return
+        }
 
-  function textInput(res) {
-    const { detail } = res
+        showOtherReason && setShowOtherReason(false)
 
-    reason = detail?.value
-  }
+        reason = item
 
-  function onSubmit() {
-    if (!reason) {
-      Taro.showToast({
-        title: '请填写举报理由',
-        icon: 'none'
-      })
-      return
+        onSubmit()
     }
 
-    Taro.$http.post(videoReport, { videoId }).then((res: RequestType) => {
-      const { code, msg } = res
-
-      if (code !== 0) {
-        Taro.showToast({
-          title: msg,
-          icon: 'none'
-        })
-        return
-      }
+    function textInput(res) {
+        const { detail } = res
 
-      Taro.showToast({
-        title: '举报成功',
-        icon: 'none'
-      })
+        reason = detail?.value
+    }
 
-      setTimeout(() => {
-        Taro.navigateBack()
-      }, 500)
-    })
-  }
-
-  return (
-    <View className='complaining-page'>
-    <View className='complaining-comment'>
-      此投诉为本小程序自有投诉渠道，非微信官方投诉渠道
-    </View>
-
-      {
-        list.map((item, index) => {
-          return (
-            <View className='reason' onClick={() => onClick(item, index)}>
-              {item}
-            </View>
-          )
+    function onSubmit() {
+        if (!reason) {
+            Taro.showToast({
+                title: '请填写举报理由',
+                icon: 'none'
+            })
+            return
+        }
+
+        Taro.$http.post(videoReport, { videoId }).then((res: RequestType) => {
+            const { code, msg } = res
+
+            if (code !== 0) {
+                Taro.showToast({
+                    title: msg,
+                    icon: 'none'
+                })
+                return
+            }
+
+            Taro.showToast({
+                title: '举报成功',
+                icon: 'none'
+            })
+
+            setTimeout(() => {
+                Taro.navigateBack()
+            }, 500)
         })
-      }
+    }
 
-      {
-        showOtherReason && <View className='other-reason'>
-          <Textarea autoFocus placeholderClass='placeholder-class' placeholder='填写举报理由' onInput={textInput}/>
+    return (
+        <View className='complaining-page'>
+            <View className='complaining-comment'>
+                此投诉为本小程序自有投诉渠道，非微信官方投诉渠道
+            </View>
 
-          <Button className='submit' onClick={onSubmit}>提交</Button>
+            {
+                list.map((item, index) => {
+                    return (
+                        <View className='reason' onClick={() => onClick(item, index)}>
+                            {item}
+                        </View>
+                    )
+                })
+            }
+
+            {
+                showOtherReason && <View className='other-reason'>
+                    <Textarea autoFocus placeholderClass='placeholder-class' placeholder='填写举报理由' onInput={textInput} />
+
+                    <Button className='submit' onClick={onSubmit}>提交</Button>
+                </View>
+            }
         </View>
-      }
-    </View>
-  )
+    )
 }
 
 export default Complaining

src/subPackages/safe/complaining/index.wxss

@@ -0,0 +1,46 @@
+.complaining-page .complaining-comment {
+  text-align: center;
+  padding: 20px 0;
+  font-size: 24px;
+  color: #999;
+}
+.complaining-page .reason {
+  box-sizing: border-box;
+  width: 100%;
+  height: 80px;
+  display: flex;
+  align-items: center;
+  padding: 0 40px;
+  font-size: 28px;
+  color: #333;
+  border-bottom: 2px solid #f7f7f7;
+}
+.complaining-page .other-reason {
+  width: 100%;
+  margin-top: 20px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 24px;
+  flex-direction: column;
+}
+.complaining-page .other-reason textarea {
+  border: 1px solid #f2f2f2;
+  padding: 10px;
+  background: #f9f9f9;
+  height: 100px;
+}
+.complaining-page .other-reason .placeholder-class {
+  font-size: 24px;
+  color: #999;
+}
+.complaining-page .other-reason .submit {
+  width: 200px;
+  height: 60px;
+  text-align: 60px;
+  font-size: 26px;
+  background: #55c57c;
+  color: #fff;
+  border: 0;
+  margin-top: 20px;
+}

src/utils/index.ts

@@ -1,217 +1,259 @@
 import Taro from '@tarojs/taro'
 
 export function isEasyMode(systemInfo: Taro.getSystemInfoSync.Result) {
-  const { fontSizeSetting = 0 } = systemInfo
+    const { fontSizeSetting = 0 } = systemInfo
 
-  if (systemInfo.platform.indexOf('ios') !== -1)
-    return fontSizeSetting > 16
+    if (systemInfo.platform.indexOf('ios') !== -1)
+        return fontSizeSetting > 16
 
-  if (systemInfo.platform.indexOf('Android') !== -1)
-    return fontSizeSetting > 17
+    if (systemInfo.platform.indexOf('Android') !== -1)
+        return fontSizeSetting > 17
 
-  return false
+    return false
 }
 
 export function S4() {
-  return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1)
+    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1)
 }
 
 export function guid() {
-  return S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4()
+    return S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4()
 }
 
 function sessionGuid() {
-  return `${new Date().getTime()}-${guid()}`
+    return `${new Date().getTime()}-${guid()}`
 }
 
 export function getPreIds() {
-  return 'pre-' + sessionGuid()
+    return 'pre-' + sessionGuid()
 }
 
 export function getViewIds() {
-  return 'view-' + sessionGuid()
+    return 'view-' + sessionGuid()
 }
 
 export function createSessionId() {
-  return `${new Date().getTime()}-${guid()}`
+    return `${new Date().getTime()}-${guid()}`
 }
 
 export function getTopSafeHeight() {
-  // 状态栏 刘海屏
-  const systemInfo = Taro.getSystemInfoSync()
-  const { statusBarHeight = 0 } = systemInfo
-  // 胶囊信息
-  const menuInfo = Taro.getMenuButtonBoundingClientRect()
-  // 导航高度固定 44px
-  let navigationBarHeight = (menuInfo.top - statusBarHeight) * 2 + menuInfo.height
-
-  navigationBarHeight = Math.min(44, navigationBarHeight)
-
-  return {
-    navigationBarHeight,
-    statusBarHeight
-  }
+    // 状态栏 刘海屏
+    const systemInfo = Taro.getSystemInfoSync()
+    const { statusBarHeight = 0 } = systemInfo
+    // 胶囊信息
+    const menuInfo = Taro.getMenuButtonBoundingClientRect()
+    // 导航高度固定 44px
+    let navigationBarHeight = (menuInfo.top - statusBarHeight) * 2 + menuInfo.height
+
+    navigationBarHeight = Math.min(44, navigationBarHeight)
+
+    return {
+        navigationBarHeight,
+        statusBarHeight
+    }
 }
 
 export function throttle(fn, wait = 50) {
-  let previous = 0
-  return function(...args) {
-    let now = +new Date()
-    if (now - previous > wait) {
-      previous = now
-      fn.apply(this, args)
+    let previous = 0
+    return function (...args) {
+        let now = +new Date()
+        if (now - previous > wait) {
+            previous = now
+            fn.apply(this, args)
+        }
     }
-  }
 }
 
 export function formatSecondsAsTime(secs) {
-  var hr = Math.floor(secs / 3600) + ''
-  var min = Math.floor((secs - +hr * 3600) / 60) + ''
-  var sec = Math.floor(secs - +hr * 3600 - +min * 60) + ''
-  var text
-  if (+hr < 10) {
-      hr = '0' + hr
-  }
-  if (+min < 10) {
-      min = '0' + min
-  }
-  if (+sec < 10) {
-      sec = '0' + sec
-  }
-  if (+hr == 0) {
-      hr = ''
-  }
-  if (hr.length > 0) {
-      text = hr + ':' + min + ':' + sec
-  } else {
-      text = min + ':' + sec
-  }
-  return text
+    var hr = Math.floor(secs / 3600) + ''
+    var min = Math.floor((secs - +hr * 3600) / 60) + ''
+    var sec = Math.floor(secs - +hr * 3600 - +min * 60) + ''
+    var text
+    if (+hr < 10) {
+        hr = '0' + hr
+    }
+    if (+min < 10) {
+        min = '0' + min
+    }
+    if (+sec < 10) {
+        sec = '0' + sec
+    }
+    if (+hr == 0) {
+        hr = ''
+    }
+    if (hr.length > 0) {
+        text = hr + ':' + min + ':' + sec
+    } else {
+        text = min + ':' + sec
+    }
+    return text
 }
 
 export function type(object, type) {
-  return Object.prototype.toString.call(object) === `[object ${type}]`
+    return Object.prototype.toString.call(object) === `[object ${type}]`
 }
 
 export function stringify(obj) {
-  if (!type(obj, 'Object'))
-    return ''
+    if (!type(obj, 'Object'))
+        return ''
 
-  return Object.entries(obj).reduce((calc, [key, val], index) => {
-    calc += `${key}=${val}`
+    return Object.entries(obj).reduce((calc, [key, val], index) => {
+        calc += `${key}=${val}`
 
-    if (index !== Object.entries(obj).length - 1)
-      calc += '&'
+        if (index !== Object.entries(obj).length - 1)
+            calc += '&'
 
-    return calc
-  }, '')
+        return calc
+    }, '')
 }
 
 export const squaredImageUrl = (originalURL, rotate, width) => {
-  // 正方形: rotate 旋转角度(整型),  方形图片
-  var url = originalURL
-  var idx = originalURL.indexOf('?')
-  if (idx !== -1) {
-      // 防止该URL已经拼接过参数
-      url = originalURL.substringToIndex(idx)
-  }
-  return url + '?x-oss-process=image/rotate,' + Math.ceil(rotate) + '/resize,m_fill,w_' + Math.ceil(width) + ',h_' + Math.ceil(width) + ',limit_0' + '/format,jpg'
+    // 正方形: rotate 旋转角度(整型),  方形图片
+    var url = originalURL
+    var idx = originalURL.indexOf('?')
+    if (idx !== -1) {
+        // 防止该URL已经拼接过参数
+        url = originalURL.substringToIndex(idx)
+    }
+    return url + '?x-oss-process=image/rotate,' + Math.ceil(rotate) + '/resize,m_fill,w_' + Math.ceil(width) + ',h_' + Math.ceil(width) + ',limit_0' + '/format,jpg'
 }
 
 export function filterCoverPath(path) {
-  if (path && path.indexOf('?') === -1) {
-      path += `?t=${Date.now()}`
-  }
-  path = path.replace(/resupload\.piaoquantv\.com/g, 'rescdn.yishihui.com')
-  path = path.replace(/weappupload\.piaoquantv\.com/g, 'rescdn.yishihui.com')
+    if (path && path.indexOf('?') === -1) {
+        path += `?t=${Date.now()}`
+    }
+    path = path.replace(/resupload\.piaoquantv\.com/g, 'rescdn.yishihui.com')
+    path = path.replace(/weappupload\.piaoquantv\.com/g, 'rescdn.yishihui.com')
 
-  return path
+    return path
 }
 
 export function mediaRotate(orientation) {
-  switch (orientation) {
-    case 'down':
-        return 180
+    switch (orientation) {
+        case 'down':
+            return 180
 
-    case 'left':
-        return -90
+        case 'left':
+            return -90
 
-    case 'right':
-        return 90
+        case 'right':
+            return 90
 
-    case 'up-mirrored':
-        return 0
+        case 'up-mirrored':
+            return 0
 
-    case 'down-mirrored':
-        return 180
+        case 'down-mirrored':
+            return 180
 
-    case 'left-mirrored':
-        return -90
+        case 'left-mirrored':
+            return -90
 
-    case 'right-mirrored':
-        return 90
+        case 'right-mirrored':
+            return 90
 
-    default:
-        return 0
-  }
+        default:
+            return 0
+    }
 }
 
 export function once(cb) {
-  let count = 1
+    let count = 1
 
-  return (...args) => {
-    if (count++ > 1)
-      return
+    return (...args) => {
+        if (count++ > 1)
+            return
 
-    cb.apply(null, args)
-  }
+        cb.apply(null, args)
+    }
 }
 
 export function formatQuery(options) {
-  if (Object.prototype.toString.call(options) !== '[object Object]')
-    return options
+    if (Object.prototype.toString.call(options) !== '[object Object]')
+        return options
 
-  const orgOptions = options
-  const params = {}
+    const orgOptions = options
+    const params = {}
 
-  let jumpPage = ''
+    let jumpPage = ''
 
-  Object.keys(options).forEach((key) => {
-    try {
-        const decodeVal = decodeURIComponent(options[key])
-        
-        params[key] = decodeVal
+    Object.keys(options).forEach((key) => {
+        try {
+            const decodeVal = decodeURIComponent(options[key])
 
-        if (key === 'jumpPage')
-            jumpPage = decodeVal
+            params[key] = decodeVal
 
-    } catch (e) {}
-  })
+            if (key === 'jumpPage')
+                jumpPage = decodeVal
 
-  return {
-    params,
-    jumpPage,
-    orgOptions
-  }
+        } catch (e) { }
+    })
+
+    return {
+        params,
+        jumpPage,
+        orgOptions
+    }
 }
 
 export function formatDate(date, fmt) {
-  var o = {
-      'M+': date.getMonth() + 1, //月份
-      'd+': date.getDate(), //日
-      'h+': date.getHours(), //小时
-      'm+': date.getMinutes(), //分
-      's+': date.getSeconds(), //秒
-      'q+': Math.floor((date.getMonth() + 3) / 3), //季度
-      S: date.getMilliseconds() //毫秒
-  }
-  if (/(y+)/.test(fmt)) {
-      fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
-  }
-  for (var k in o) {
-      if (new RegExp('(' + k + ')').test(fmt)) {
-          fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length))
-      }
-  }
-  return fmt
-}
+    var o = {
+        'M+': date.getMonth() + 1, //月份
+        'd+': date.getDate(), //日
+        'h+': date.getHours(), //小时
+        'm+': date.getMinutes(), //分
+        's+': date.getSeconds(), //秒
+        'q+': Math.floor((date.getMonth() + 3) / 3), //季度
+        S: date.getMilliseconds() //毫秒
+    }
+    if (/(y+)/.test(fmt)) {
+        fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
+    }
+    for (var k in o) {
+        if (new RegExp('(' + k + ')').test(fmt)) {
+            fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length))
+        }
+    }
+    return fmt
+}
+
+
+// 视频卡片需要参数过滤重组一次，并不需要把所有的数据都传进去
+export function filterCardProps(list, pageSource) {
+    return list.map((item: RoughCardType) => {
+        const {
+            title, coverImg, user, id, videoPath,
+            recomTraceId, flowPool, shareTitle = ''
+        } = item || {}
+        const { coverImgPath = '' } = coverImg || {}
+        const { avatarUrl = '', nickName = '', uid = 0 } = user || {}
+
+        return {
+            id,
+            title,
+            coverImgPath,
+            shareTitle,
+            videoPath,
+            recomTraceId,
+            flowPool,
+            pageSource,
+            user: {
+                uid,
+                avatarUrl,
+                nickName,
+            }
+        }
+    })
+}
+
+export function getOption(options) {
+    const { query } = options
+    const { params, jumpPage } = formatQuery(query)
+  
+    return {
+        path: options.path || '',
+        params: params,
+        jumpPage: jumpPage,
+        tabIndex: 0,
+        categoryIndex: 55
+    }
+  }

src/utils/oss.ts

@@ -4,54 +4,54 @@ import { ossSignatureUrl } from '@/http/api'
 import network from '@/class/Network';
 
 export async function uploadImageFile(imageInfo) {
-  const signature = await _getSignature(1)
+    const signature = await _getSignature(1)
 
-  if (!signature.accessId)
-    return Promise.reject({ message: 'no signature accessId' })
+    if (!signature.accessId)
+        return Promise.reject({ message: 'no signature accessId' })
 
-  return _uploadFile(imageInfo.tempFilePath, signature)
+    return _uploadFile(imageInfo.tempFilePath, signature)
 }
 
 function _getSignature(fileType) {
-  return http.post(ossSignatureUrl, { fileType: fileType })
-    .then((res: RequestType) => {
-      const { data, code } = res
-      if (code !== 0)
-        return {}
+    return http.post(ossSignatureUrl, { fileType: fileType })
+        .then((res: RequestType) => {
+            const { data, code } = res
+            if (code !== 0)
+                return {}
 
-      return data
-    }).catch(err => {
-      console.log(err)
-      return {}
-    })
+            return data
+        }).catch(err => {
+            console.log(err)
+            return {}
+        })
 }
 
 function _uploadFile(fileTempPath, signature) {
-  return new Promise((resolve, reject) => {
-    Taro.uploadFile({
-      filePath: fileTempPath,
-      url: signature.host,
-      name: 'file',
-      formData: {
-          key: signature.fileName,
-          OSSAccessKeyId: signature.accessId,
-          policy: signature.policy,
-          signature: signature.signature,
-          success_action_status: '200',
-          name: fileTempPath,
-          networkType: network.networkType
-      },
-      success() {
-        resolve({
-          fileUrl: signature.host + signature.fileName,
-          objectKey: signature.fileName,
-          host: signature.host,
-          relativeUrl: signature.fileName
+    return new Promise((resolve, reject) => {
+        Taro.uploadFile({
+            filePath: fileTempPath,
+            url: signature.host,
+            name: 'file',
+            formData: {
+                key: signature.fileName,
+                OSSAccessKeyId: signature.accessId,
+                policy: signature.policy,
+                signature: signature.signature,
+                success_action_status: '200',
+                name: fileTempPath,
+                networkType: network.networkType
+            },
+            success() {
+                resolve({
+                    fileUrl: signature.host + signature.fileName,
+                    objectKey: signature.fileName,
+                    host: signature.host,
+                    relativeUrl: signature.fileName
+                })
+            },
+            fail(err) {
+                reject(err)
+            }
         })
-      },
-      fail(err) {
-        reject(err)
-      }
     })
-  })
 }

types/global.d.ts

@@ -12,27 +12,27 @@ declare module '*.sass';
 declare module '*.styl';
 
 declare namespace NodeJS {
-  interface ProcessEnv {
-    /** NODE 内置环境变量, 会影响到最终构建生成产物 */
-    NODE_ENV: 'development' | 'production',
-    /** 当前构建的平台 */
-    TARO_ENV: 'weapp' | 'swan' | 'alipay' | 'h5' | 'rn' | 'tt' | 'quickapp' | 'qq' | 'jd'
-    /**
-     * 当前构建的小程序 appid
-     * @description 若不同环境有不同的小程序，可通过在 env 文件中配置环境变量`TARO_APP_ID`来方便快速切换 appid， 而不必手动去修改 dist/project.config.json 文件
-     * @see https://taro-docs.jd.com/docs/next/env-mode-config#特殊环境变量-taro_app_id
-     */
-    TARO_APP_ID: string
-  }
+    interface ProcessEnv {
+        /** NODE 内置环境变量, 会影响到最终构建生成产物 */
+        NODE_ENV: 'development' | 'production',
+        /** 当前构建的平台 */
+        TARO_ENV: 'weapp' | 'swan' | 'alipay' | 'h5' | 'rn' | 'tt' | 'quickapp' | 'qq' | 'jd'
+        /**
+         * 当前构建的小程序 appid
+         * @description 若不同环境有不同的小程序，可通过在 env 文件中配置环境变量`TARO_APP_ID`来方便快速切换 appid， 而不必手动去修改 dist/project.config.json 文件
+         * @see https://taro-docs.jd.com/docs/next/env-mode-config#特殊环境变量-taro_app_id
+         */
+        TARO_APP_ID: string
+    }
 }
 
 interface RequestType {
     code: number,
     data: any,
     msg: string
-  }
-  
-  interface AbGroupContextType {
+}
+
+interface AbGroupContextType {
     listen(evt: Function): this
     emit(): this
     loop(time?: number): this
@@ -40,27 +40,27 @@ interface RequestType {
     cleanStack(): this
     get(): object
     storeGroup(config: object): void
-    getExperimentConfigByName(name: string|number): object | undefined
-    validExperiment(name: string|number): boolean
-  }
-  
-  type ConfigType = {
+    getExperimentConfigByName(name: string | number): object | undefined
+    validExperiment(name: string | number): boolean
+}
+
+type ConfigType = {
     header?: {},
     method?: 'GET' | 'POST',
     timeout?: number
-  }
-  
-  type DataType = {
+}
+
+type DataType = {
     [key: string]: any
     baseInfo?: object
-  }
-  
-  type HttpInstanceType = {
+}
+
+type HttpInstanceType = {
     get(url: string, data?: {}, config?: ConfigType): Promise<any>
     post(url: string, data?: {}, config?: ConfigType): Promise<any>
-  }
-  
-  type RoughCardType = {
+}
+
+type RoughCardType = {
     title: string
     shareTitle: string
     coverImg: any
@@ -78,9 +78,10 @@ interface RequestType {
     measureType: number
     recommendLogVO: string
     recommendSource: number
-  }
-  
-  type CardType = {
+    pageSource: String
+}
+
+type CardType = {
     title: string
     coverImgPath: string
     playCount: number
@@ -92,19 +93,19 @@ interface RequestType {
     videoCoverSnapshotPath: string
     shareImgPath: string
     favorited: boolean
-  }
-  
-  declare namespace Taro {
+}
+
+declare namespace Taro {
     // eslint-disable-next-line @typescript-eslint/no-empty-interface
     interface TaroStatic {
-      $app: Taro.getApp.Instance<TaroGeneral.IAnyObject>
-      $global: any
-      $wx: any
-      $http: HttpInstanceType
-      $abGroupInstance: AbGroupContextType
-      $network: any
-      loginSync(): Promise<TaroGeneral.CallbackResult>
+        $app: Taro.getApp.Instance<TaroGeneral.IAnyObject>
+        $global: any
+        $wx: any
+        $http: HttpInstanceType
+        $abGroupInstance: AbGroupContextType
+        $network: any
+        loginSync(): Promise<TaroGeneral.CallbackResult>
     }
-  }
-  
-  declare const wx
+}
+
+declare const wx