\n
\n \n\n \n 直播中\n \n {formatNumber(popularity)}人在看\n \n
\n \n \n \n {title}\n \n \n\n \n {\n sendTeaCommEvent('click_home_live_follow_profile', {\n sub_tab: '我的关注',\n user_id: user_info.user_id_str,\n })\n }}\n >\n \n {user_info.user_name}\n \n \n
\n \n \n )\n}\n\nconst follow = (\n subscribed: boolean,\n user_id_str: string,\n onFollow: (x: string, b: boolean) => void,\n globalState: { userData?: { user_id?: string } },\n openLogin: (commonParams: ILoginCommonParams) => void\n) => {\n if (subscribed) return\n sendTeaCommEvent('click_home_live_follow_user', {\n sub_tab: '推荐直播间',\n user_id: user_id_str,\n })\n const my_user_id = get(globalState, 'userData.user_id')\n if (!my_user_id) {\n openLogin({\n enter_method: 'follow',\n })\n return\n }\n // 先假设关注成功\n onFollow(user_id_str, true)\n focus({\n user_id: Number(my_user_id),\n to_user_id: Number(user_id_str),\n }).catch(() => {\n // 如果失败了，重置关注状态\n onFollow(user_id_str, false)\n })\n}\n\nfunction Card(props: {\n data: FolloweeData\n onFollow: (x: string, b: boolean) => void\n}) {\n const {\n data: { fans_num = 0, title, user_info, room_id, subscribed = false },\n onFollow,\n } = props\n const { state: globalState } = useContext(GlobalStoreContext)\n const { openLogin } = useContext(LoginStoreContext)\n const { className: avatar_class, styles: avatar_styles } = AvatarStyle\n return (\n \n {\n sendTeaCommEvent('click_home_live_follow_profile', {\n sub_tab: '推荐直播间',\n user_id: user_info.user_id_str,\n })\n }}\n >\n \n \n \n 直播中\n \n \n
\n\n \n \n {recfollowees.length !== 0 && (\n {\n sendTeaCommEvent('click_home_live_follow_tab', {\n sub_tab: '推荐直播间',\n })\n setTagNow('recommend')\n }}\n >\n 推荐直播间\n \n )}\n\n {\n sendTeaCommEvent('click_home_live_follow_tab', {\n sub_tab: '我的关注',\n })\n setTagNow('mine')\n }}\n >\n 我的关注\n \n
\n \n {tagNow === 'recommend' ? (\n recfollowees.map((e) => (\n
\n\n \n \n )\n}\n","import React, { useState, useEffect, useRef, useContext } from 'react'\nimport Link from 'next/link'\nimport get from 'lodash/get'\nimport getUrl from 'lib/url'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport SwiperCore, { Navigation } from 'swiper'\n\nSwiperCore.use([Navigation])\n\nimport { focus } from 'lib/ugc-interact'\nimport { getLoginHref } from 'lib/get-login-href'\nimport { GlobalStoreContext } from 'Components/store'\nimport Loading from 'Components/loading'\nimport { sendTeaCommEvent } from 'lib/tea-analyze'\nimport AvatarStyle from 'Constants/global-styles/avatar-style'\nimport fetch from 'lib/decorated-fetch'\nimport groupBy from 'lib/groupBy'\nimport { stringify } from 'querystring'\nimport { LoginStoreContext } from 'New/login/login-store'\nimport { ILoginCommonParams } from 'New/login/context/view-context'\nconst dateImg = require('static/date@3x.png')\nconst SWIPER_LENGTH = 6\nconst error_pic = require('static/error-pic@3x.jpg')\n\ninterface CardProps extends CelebrityInfo {\n index: number\n onFollow: (uid: string, b: boolean) => void\n}\n\nconst follow = (\n isSubscribing: boolean,\n user_id_str: string,\n onFollow: (uid: string, b: boolean) => void,\n setIsSubscribing: (x: boolean) => void,\n globalState: { userData?: { user_id?: string } },\n openLogin: (commonParams?: ILoginCommonParams) => void\n) => {\n if (isSubscribing) return\n sendTeaCommEvent('click_home_live_top_anchor_follow', {\n anchor_id: user_id_str,\n })\n const my_user_id: number = get(globalState, 'userData.user_id')\n if (!my_user_id) {\n openLogin({\n enter_method: 'follow',\n })\n return\n }\n // 先假设关注成功\n setIsSubscribing(true)\n onFollow(user_id_str, true)\n focus({\n user_id: Number(my_user_id),\n to_user_id: Number(user_id_str),\n }).catch(() => {\n // 如果失败了，重置关注状态\n setIsSubscribing(false)\n onFollow(user_id_str, false)\n })\n}\n\nfunction Card(props: CardProps) {\n const {\n user_id_str = '',\n name,\n avatar_url = '',\n is_following = false,\n desc,\n index,\n onFollow,\n status,\n room_id,\n } = props\n\n const { state: globalState } = useContext(GlobalStoreContext)\n const { openLogin } = useContext(LoginStoreContext)\n const { className: avatar_class, styles: avatar_styles } = AvatarStyle\n const [isSubscribing, setIsSubscribing] = useState(is_following)\n\n // 更新订阅信息\n useEffect(() => {\n setIsSubscribing(is_following)\n }, [is_following])\n\n return (\n \n {isLoading ? (\n 
\n 网络异常，点击重试\n {\n getMyFollowees(setMyfollowees, setFailed, setLoading)\n }}\n >\n 重试\n \n \n )}\n
\n ) : isLogin ? (\n myfollowees.length > 0 ? (\n myfollowees.map((e) => \n 
\n \n 暂时没有主播在直播哦,\n
\n 换个时间再来吧~\n \n
\n )\n ) : (\n \n 换个时间再来吧~\n \n
\n \n 暂无直播\n {\n openLogin({\n enter_method: 'other',\n })\n }}\n >\n 登录看主播\n \n
\n )}\n \n \n \n \n 直播中\n \n \n ) : (\n \n \n \n \n \n )}\n \n\n \n \n {name}\n \n \n {desc}\n {\n follow(\n isSubscribing,\n user_id_str,\n onFollow,\n setIsSubscribing,\n globalState,\n openLogin\n )\n }}\n >\n {isSubscribing ? '已关注' : '关注'}\n \n {avatar_styles}\n \n
\n )\n}\n\nexport interface CelebrityWeek {\n anchor_id: string\n desc: string\n date_week: string\n}\n\nexport interface CelebrityMonth {\n anchor_id: string\n desc: string\n date_month: string\n}\n\ninterface CelebrityInfo {\n user_id_str: string\n name: string\n avatar_url: string\n is_following: boolean\n desc: string\n status: number\n room_id: string\n}\n\nconst timestampToWeek = (timestamp: number, addDays = 6, showYear = false) => {\n try {\n const date = new Date(timestamp)\n const d = new Date(date.getTime() + addDays * 86400000)\n return `${showYear ? `${d.getFullYear()}/` : ''}${`0${\n d.getMonth() + 1\n }`.slice(-2)}/${`0${d.getDate()}`.slice(-2)}`\n } catch (e) {\n console.error(e)\n return ''\n }\n}\nconst timestampToMonth = (timestamp: number) => {\n const date = new Date(timestamp)\n return `${date.getFullYear()}/${`0${date.getMonth() + 1}`.slice(-2)}`\n}\n\nconst getAllIDs = async (timestamp: number, tag: 'weekly' | 'monthly') => {\n const params = {\n templated_key: tag === 'weekly' ? 'kol_rank_week' : 'kol_rank_month',\n timestamp,\n }\n try {\n const json = await fetch(`/motor/pleasure/common_rank?${stringify(params)}`)\n return json?.data?.rank_list || []\n } catch (err) {\n return []\n }\n}\n\nconst getCelebrity = async (\n tag: 'weekly' | 'monthly',\n timestamp: number,\n setInfo: (x: CelebrityInfo[]) => void\n) => {\n const ids: any[] = await getAllIDs(timestamp, tag)\n if (ids.length === 0) {\n return\n }\n const params = {\n user_ids: ids.map((e) => e.id_str).join(','),\n }\n return fetch(\n getUrl(`/motor/dlive/api/get_room_by_users?${stringify(params)}`)\n ).then((json) => {\n if (json.status !== 0) {\n throw new Error(`请求达人数据失败。 error status: ${json.status}\n error message: ${json.message}`)\n }\n setInfo(\n json.data.map(\n (e: {\n user_info: {\n user_id_str?: string\n name?: string\n avatar_url?: string\n }\n is_following?: boolean\n user_room_data_list: {\n status: number\n id_str: string\n }[]\n }) => {\n const {\n user_info: { user_id_str = '', name = '', avatar_url = '' },\n is_following = false,\n user_room_data_list = [],\n } = e\n const item = ids.find(({ id_str }) => id_str === user_id_str)\n const desc =\n item?.bottom_prefix && item?.bottom_value\n ? `${item?.bottom_prefix}: ${item?.bottom_value}`\n : ''\n const { status = 0, id_str: room_id = '' } =\n user_room_data_list?.[0] || {}\n return {\n user_id_str,\n name,\n avatar_url,\n is_following,\n desc,\n status,\n room_id,\n }\n }\n )\n )\n })\n}\n\nfunction Celebrity() {\n const [tagNow, setTagNow] = useState<'weekly' | 'monthly'>('monthly')\n const [weeklyInfo, setWeeklyInfo] = useState\n {index + 1}\n
\n \n {status === 2 ? (\n \n
\n \n {\n setFold(false)\n }}\n onBlur={() => {\n setFold(true)\n }}\n tabIndex={0}\n ref={ref}\n >\n {tagNow === 'weekly' ? (\n \n {timestampToWeek(timestamp * 1000, 0, true) || ''} -{' '}\n {timestampToWeek(timestamp * 1000) || ''}\n \n ) : (\n \n {timestampToMonth(timestamp * 1000) || ''}\n \n )}\n\n {\n if (ref.current) {\n ref.current.blur()\n }\n }}\n >\n {renderCards()}\n
\n 达人主播榜
\n\n {\n setTagNow('monthly')\n }}\n >\n 月榜\n \n {\n setTagNow('weekly')\n }}\n >\n 周榜\n \n
\n \n \n {failed ? (\n \n {(tagNow === 'monthly' ? monthlyInfo : weeklyInfo).map(\n (e, index) => (\n \n \n )\n )}\n \n \n \n ) : (\n
\n \n \n )\n}\n\nexport default Celebrity\n","import React, { useState, useEffect, useMemo } from 'react'\nimport Link from 'next/link'\nimport getUrl from 'lib/url'\nimport { sendTeaCommEvent } from 'lib/tea-analyze'\nimport Loading from 'Components/loading'\nimport ScrollLoader from 'Components/scroll-loader'\nimport serializeObject from '@arsenal/arsenal/modules/serializeObject'\nimport Cookies from '@arsenal/arsenal/modules/Cookies'\nimport { useCityName } from 'Components/hooks'\nimport formatNumber from '@arsenal/arsenal/modules/formatNumber'\nimport fetch from 'lib/decorated-fetch'\nconst LIVE_TYPE = 5258\nconst all_live_img = require('static/icon-all@3x.png')\nconst local_img = require('static/icon-local@3x.png')\nconst kol_img = require('static/icon-kol@3x.png')\nconst empty_pic = require('static/empty-pic@3x.png')\ninterface BrandCard {\n brand_id?: string\n name: string\n logo: string\n brand_initial?: string\n}\n\ninterface BrandProps {\n brandCard: BrandCard\n active?: boolean\n onClickTag: (bid: string) => void\n}\n\nconst live_black_gif = require('static/live-black.gif')\nexport interface LiveData {\n user_info: {\n name: string\n avatar_url: string\n user_id: string\n }\n share_info: {\n title: string\n share_url: string\n }\n user_count: number\n image_list: [{ url: string }]\n status_icon: string\n status: number\n unique_id_str: string\n card_content?: { list: [IBannerList] }\n type: number\n popularity_display?: string\n behot_time?: number\n}\n\nexport interface IBannerList {\n open_url: string\n img_url: string\n title: string\n gid: string\n user_info?: {\n user_id: string\n }\n}\n\ninterface CardProps extends LiveData {\n onClick: (uid: string, rid: string) => void\n}\n\nfunction Card(props: CardProps) {\n const {\n unique_id_str,\n status: type,\n share_info: { title, share_url },\n image_list,\n user_info: { name, avatar_url, user_id },\n user_count,\n onClick,\n } = props\n const url = image_list[0]?.url || ''\n return (\n \n {isLoading ? (\n {\n fetchCelebrityData()\n }}\n >\n 重试\n \n \n )}\n
\n ) : isLoading ? (\n \n
\n \n
\n )}\n \n
\n \n\n \n \n {type === 2 && (\n 
\n )}\n {type === 2 ? '直播中' : '直播预告'}{' '}\n \n \n {formatNumber(user_count)}人在观看\n \n
\n \n \n \n {title}\n \n \n \n \n \n {name}\n \n \n
\n\n \n \n )\n}\n\nfunction BrandCard(props: BrandProps) {\n const {\n brandCard: { logo, name, brand_id = '' },\n active,\n onClickTag,\n } = props\n return (\n \n \n
\n )\n}\n","import React, { useState, useEffect, CSSProperties, useMemo } from 'react'\nimport LiveSwiper from './components/live-swiper'\nimport Followees from './components/followees'\nimport serializeObject from '@arsenal/arsenal/modules/serializeObject'\nimport Cookies from '@arsenal/arsenal/modules/Cookies'\nimport Footer from 'Components/footer-statement'\nimport { isNewVersion } from 'lib/version'\nimport Head from 'next/head'\n\nimport Celebrity, {\n CelebrityMonth,\n CelebrityWeek,\n} from './components/celebrity'\nimport LiveShows, {\n LiveData,\n IBannerList,\n mapShownData,\n} from './components/live-show'\nimport getUrl from 'lib/url'\nimport fetch from 'lib/decorated-fetch'\n\ninterface IBannerProps {\n bannerData: IBannerList[]\n loaded: 0 | 1 | 2\n}\n\nconst BANNER_TYPE = 5256\nconst SECOND_TYPE = 5257\nconst LIVE_TYPE = 5258\nconst LIMIT = 5\n\n// 获取banner位数据\nconst getBannerData = async (allInfo: LiveData[]) => {\n const bannerData: IBannerList[] = []\n allInfo\n .filter((e) => e?.type === BANNER_TYPE)\n .forEach((e) => {\n const list = e?.card_content?.list || []\n list.forEach((e) => {\n if (/livechat/.test(e?.open_url || '')) {\n //const result = (e?.open_url || '').match(/room_id=(\\d+)/)\n bannerData.push({\n open_url: e?.open_url,\n img_url: e?.img_url,\n title: e?.title,\n gid: e?.gid,\n })\n }\n })\n })\n if (bannerData.length > 0) {\n return bannerData\n }\n const web_id = Cookies('tt_webid') || ''\n const defaultParams = {\n tt_from: 'pull',\n category: 'motor_car_live_complex',\n refer: 1,\n count: 12,\n impression_info: JSON.stringify({\n page_id: 'page_category',\n sub_tab: 'motor_car_live_complex',\n }),\n motor_feed_extra_params: JSON.stringify({\n new_feed: true,\n feed_type: 3,\n refresh_num: 1,\n loadmore_num: 0,\n from_page_id: 'page_category',\n live_sub_tab: 'kol',\n }),\n channel: 'web',\n device_platform: 'web',\n aid: 1839,\n user_id: web_id,\n source: 'pc',\n }\n try {\n const json = await fetch(\n getUrl(\n `/motor/stream_entrance/get_feed_pc/v46/?${serializeObject(\n defaultParams\n )}`\n )\n )\n const kols: any[] = []\n for (let i = 0; i < (json.data?.length || 0); i++) {\n const ele = json.data[i]\n if (i > 0) {\n if (kols[0].gid !== ele.unique_id_str) {\n kols.push({\n open_url: ele?.info?.share_info?.share_url,\n img_url: ele?.info?.image_list?.[0]?.url,\n title: ele?.info?.title,\n gid: ele?.unique_id_str,\n })\n break\n }\n } else {\n kols.push({\n open_url: ele?.info?.share_info?.share_url,\n img_url: ele?.info?.image_list?.[0]?.url,\n title: ele?.info?.title,\n gid: ele?.unique_id_str,\n })\n }\n }\n return [\n ...kols,\n ...(allInfo\n ?.filter((e) => e?.type === LIVE_TYPE)\n ?.slice(0, 3 - kols.length)\n ?.map((e) => ({\n open_url: e?.share_info?.share_url,\n img_url: e?.image_list?.[0]?.url,\n title: e?.share_info?.title,\n gid: e?.unique_id_str,\n })) || []),\n ]\n } catch (err) {\n return (\n allInfo\n ?.filter((e) => e?.type === LIVE_TYPE)\n ?.slice(0, 3)\n ?.map((e) => ({\n open_url: e?.share_info?.share_url,\n img_url: e?.image_list?.[0]?.url,\n title: e?.share_info?.title,\n gid: e?.unique_id_str,\n })) || []\n )\n }\n}\n\nexport const renderTitle = (\n noData = false,\n title: string | undefined,\n loaded = 0,\n style: CSSProperties = {},\n defaultStyle: CSSProperties = {}\n) => {\n const default_style = noData ? defaultStyle : {}\n return (\n 正在直播
\n\n\n {brands.map((e) => (\n {\n setBrandNow(bid)\n }}\n />\n ))}\n
\n\n \n {shownData.length !== 0 ? (\n shownData.map((e, index) => (\n {\n sendTeaCommEvent('click_home_live_living_cell', {\n sub_tab: brandNow,\n anchor_id: user_id,\n room_id: unique_id_str,\n })\n }}\n />\n ))\n ) : !isLoading ? (\n
\n \n {isLoading && \n \n \n 当前直播已结束\n
\n 再去看看其他的吧~\n \n
\n ) : null}\n \n 再去看看其他的吧~\n \n
\n {!noData\n ? title\n : loaded === 1\n ? '本时段暂无直播，可以逛逛其他内容哦~'\n : loaded === 0\n ? '直播加载中'\n : '网络异常，建议刷新页面重试哦～'}\n
\n )\n}\n\nconst LiveBannerWrapper = (props: IBannerProps) => {\n const { bannerData = [], loaded = 0 } = props\n const [slideIndex, setSlideIndex] = useState(0)\n return (\n\n \n
\n )\n}\n\nfunction LiveHome() {\n const [bannerData, setBannerData] = useState\n {renderTitle(\n bannerData.length === 0,\n bannerData[slideIndex]?.title,\n loaded,\n {\n fontSize: '18px',\n fontWeight: 500,\n lineHeight: '24px',\n },\n {\n color: '#979aa8',\n textAlign: 'center',\n fontSize: '16px',\n width: '100%',\n }\n )}\n {bannerData.length !== 0 && (\n \n \n \n )}\n
\n\n \n \n \n \n \n
\n )\n}\n\nLiveHome.getInitialProps = async (props: any) => {\n return {\n _pageType: isNewVersion(props?.req?._isNewVersion) ? 'full auto-nav' : '',\n }\n}\nexport default LiveHome\n","function _nonIterableSpread() {\n throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nmodule.exports = _nonIterableSpread;","module.exports = \"https://sf6-scmcdn2-tos.pstatp.com/motor/pc/_next/static/images/icon-kol@3x-1555a5cca3942e99a13452d66cd92d3c.png\";","module.exports = \"https://sf6-scmcdn2-tos.pstatp.com/motor/pc/_next/static/images/empty-pic@3x-86c44b3d900009bb58749fabe418c787.png\";","function _iterableToArray(iter) {\n if (typeof Symbol !== \"undefined\" && Symbol.iterator in Object(iter)) return Array.from(iter);\n}\n\nmodule.exports = _iterableToArray;","import React from 'react'\n\nexport const HeadManagerContext: React.Context<{\n updateHead?: (state: any) => void\n mountedInstances?: any\n}> = React.createContext({})\n\nif (process.env.NODE_ENV !== 'production') {\n HeadManagerContext.displayName = 'HeadManagerContext'\n}\n","var arrayLikeToArray = require(\"./arrayLikeToArray\");\n\nfunction _arrayWithoutHoles(arr) {\n if (Array.isArray(arr)) return arrayLikeToArray(arr);\n}\n\nmodule.exports = _arrayWithoutHoles;","function _getPrototypeOf(o) {\n module.exports = _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {\n return o.__proto__ || Object.getPrototypeOf(o);\n };\n return _getPrototypeOf(o);\n}\n\nmodule.exports = _getPrototypeOf;","function _assertThisInitialized(self) {\n if (self === void 0) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return self;\n}\n\nmodule.exports = _assertThisInitialized;","/* 声明文件 */\nimport React from 'react'\nimport { isNewVersion } from 'lib/version'\nexport default function Statement({ className }: { className?: string }) {\n const year = new Date().getFullYear()\n return (\n \n
\n \n
\n \n
\n \n \n
\n\n \n \n
\n )\n}\n","var arrayWithoutHoles = require(\"./arrayWithoutHoles\");\n\nvar iterableToArray = require(\"./iterableToArray\");\n\nvar unsupportedIterableToArray = require(\"./unsupportedIterableToArray\");\n\nvar nonIterableSpread = require(\"./nonIterableSpread\");\n\nfunction _toConsumableArray(arr) {\n return arrayWithoutHoles(arr) || iterableToArray(arr) || unsupportedIterableToArray(arr) || nonIterableSpread();\n}\n\nmodule.exports = _toConsumableArray;","'use strict';\nvar $ = require('../internals/export');\nvar aFunction = require('../internals/a-function');\nvar toObject = require('../internals/to-object');\nvar fails = require('../internals/fails');\nvar arrayMethodIsStrict = require('../internals/array-method-is-strict');\n\nvar test = [];\nvar nativeSort = test.sort;\n\n// IE8-\nvar FAILS_ON_UNDEFINED = fails(function () {\n test.sort(undefined);\n});\n// V8 bug\nvar FAILS_ON_NULL = fails(function () {\n test.sort(null);\n});\n// Old WebKit\nvar STRICT_METHOD = arrayMethodIsStrict('sort');\n\nvar FORCED = FAILS_ON_UNDEFINED || !FAILS_ON_NULL || !STRICT_METHOD;\n\n// `Array.prototype.sort` method\n// https://tc39.github.io/ecma262/#sec-array.prototype.sort\n$({ target: 'Array', proto: true, forced: FORCED }, {\n sort: function sort(comparefn) {\n return comparefn === undefined\n ? nativeSort.call(toObject(this))\n : nativeSort.call(toObject(this), aFunction(comparefn));\n }\n});\n","module.exports = \"https://sf6-scmcdn2-tos.pstatp.com/motor/pc/_next/static/images/icon-local@3x-d4cbc092f9df8cfaee142b00a0130bed.png\";","import React, { Component } from 'react'\n\nconst isServer = typeof window === 'undefined'\n\ntype State = JSX.Element[] | undefined\n\ntype SideEffectProps = {\n reduceComponentsToState: \n
\n \n \n © {year} 懂车帝 www.dongchedi.com{' '}\n
\n 公司名称：北京空间变换科技有限公司{' '}\n \n 中央网信办违法和不良信息举报中心{' '}\n \n 违法和不良信息举报电话：400-140-2108\n
\n\n
\n {/*