feats

src/layouts/index.jsx

 import { useMemo } from 'react'
 import Taro from '@tarojs/taro'
 import { useModel } from '@/store'
+import { getQueryString } from '@/utils'
 import useRouter from '@/utils/hooks/useRouter'
+import useTrackPage from '@/utils/hooks/useTrackPage'
 import Loading from './Loading'
 import { getPageBy, getIndexPageOf } from '../routes'
 
 export default (Child) => (props) => {
+  const location = Taro.getStorageSync('location')
+
   const { person } = useModel('person')
   const router = useRouter()
 
+  // 埋点页面访问
+  const trackPageData = {
+    page: router.path,
+    params: getQueryString(router.params),
+    location,
+  }
+  useTrackPage(trackPageData)
+
   // 确保人员信息到位
   const loading = !person?.personRole;
 
     })
   }
 
-  return loading ? <Loading /> : <Child {...props} person={person} router={router} />
+  return loading ? <Loading /> : <Child {...props} person={person} router={router} location={location} />
 }

src/pages/index/index.config.js

   styleIsolation: 'shared',
   usingComponents: {
     "mp-tabbar": "weui-miniprogram/tabbar/tabbar",
+    "mp-tabs": "../../../components/tabs/index",
     "mp-checkbox-group": "weui-miniprogram/checkbox-group/checkbox-group",
     "mp-checkbox": "weui-miniprogram/checkbox/checkbox",
     "mp-cells": "weui-miniprogram/cells/cells",

src/services/track.js

+import request from '@/utils/request'
+
+/**
+ * 埋点页面访问
+ * @param {*} data 
+ * @returns 
+ */
+export const trackPage = (data) => request('/track/page', { data, method: 'post', skipError: true })
+
+/**
+ * 更新埋点访问
+ * @param {*} id 
+ * @returns 
+ */
+export const updateTrackPage = (id) => request(`/track/page/${id}`, { method: 'put', skipError: true })

src/utils/hooks/useTrackPage.js

 
 import { useRef } from 'react'
-import { useDidShow, useDidHide } from '@tarojs/taro'
+import { useDidShow, useDidHide, nextTick } from '@tarojs/taro'
+import { trackPage, updateTrackPage } from '@/services/track'
 
-export default (fun) => {
+export default (payload) => {
+  const payloadRef = useRef()
+  const resRef = useRef()
+  payloadRef.current = payload
 
+  useDidShow(() => {
+    trackPage(payloadRef.current).then((res) => {
+      resRef.current = res;
+    }).catch((err) => {
+      console.error(err);
+    })
+  })
 
+  useDidHide(() => {
+    if (resRef.current) {
+      updateTrackPage(resRef.current.trackId)
+      resRef.current = undefined
+    }
+  })
 }

src/utils/index.js

 
+/**
+ * queryString 转 object
+ * @param {*} queryStr 
+ * @returns 
+ */
 export function parseQueryString(queryStr) {
   if (!queryStr) {
     return;
   }, {});
   return params;
 }
+
+/**
+ * object 转 queryStr
+ * @param {*} params 
+ * @returns 
+ */
+export function getQueryString(params) {
+  if (!params) return ;
+
+  const keys = Object.keys(params)
+  const arr = keys.map((key) => {
+    const val = params[key]
+    return `${key}=${encodeURIComponent(val)}`
+  })
+
+  return arr.join('&')
+}

src/utils/preFetchData.js

   const personId = Taro.getStorageSync('personId')
   const openid = Taro.getStorageSync('openid')
 
-  return Promise.resolve({ personId, openid })
+  return new Promise((resolve, reject) => {
+    Taro.getLocation({
+      success(res) {
+        const location = `${res.longitude},${res.latitude}`
+        Taro.setStorageSync('location', location)
+        resolve({
+          location,
+          personId,
+          openid
+        })
+      },
+      fail(err) {
+        console.error(err)
+        reject(err)
+      }
+    })
+  })
 
   // return new Promise((resolve, reject) => {
   //   Taro.getBackgroundFetchData({

src/utils/request.js

 
 import Taro from '@tarojs/taro'
+import { getQueryString } from '.'
 
 const logger = Taro.getRealtimeLogManager()
 
-const object2QueryString = (params) => {
-  if (!params) return ;
-
-  const keys = Object.keys(params)
-  const arr = keys.map((key) => {
-    const val = params[key]
-    return `${key}=${encodeURIComponent(val)}`
-  })
-
-  return arr.join('&')
-}
-
 export default (url, options) => {
   const { params, skipError, header, ...leftOptions } = options || {}
-  const queryStr = object2QueryString(params)
+  const queryStr = getQueryString(params)
 
   const urlWithParams = queryStr ? `${url}?${queryStr}` : url;
   const nwUrl = `${HOST}/api/wx${urlWithParams}`