- fixed #189

src/screens/_/base/eps/types.ts

@@ -9,7 +9,7 @@ import { Fn, SubjectId, ViewStyle } from '@types'
 export type Props = {
   style?: ViewStyle
 
-  /** 详情页模式, 显示SP和更多的操作按钮 */
+  /** 详情页模式, 显示 SP 和更多的操作按钮 */
   advance?: boolean
 
   /** 是否有播放源 */
@@ -33,10 +33,10 @@ export type Props = {
   /** 容器右侧的 margin 值 */
   marginRight?: number
 
-  /** 1行多少个, 为了美观, 通过计算按钮占满1行, iPad 会忽略 */
+  /** 1 行多少个, 为了美观, 通过计算按钮占满 1 行, iPad 会忽略 */
   numbersOfLine?: number
 
-  /** 是否分页, 1页4行按钮, 不分页显示1页, 分页会显示 Carousel */
+  /** 是否分页, 1 页 4 行按钮, 不分页显示 1 页, 分页会显示 Carousel */
   pagination?: boolean
 
   /** 条目 Id */

src/screens/home/v2/component/extra/index.tsx

@@ -8,16 +8,16 @@ import React from 'react'
 import { Track } from '@components'
 import { ErrorNotice, LoginNotice } from '@_'
 import { obc } from '@utils/decorators'
-import { STORYBOOK } from '@constants'
+import { WEB } from '@constants'
 import { Ctx } from '../../types'
 import { COMPONENT } from './ds'
 
-function Extra(props, { $, navigation }: Ctx) {
+function Extra(_props, { $, navigation }: Ctx) {
   return (
     <>
       <Track title='首页' hm={$.hm} />
       <ErrorNotice />
-      {!STORYBOOK && <LoginNotice navigation={navigation} />}
+      {!WEB && <LoginNotice navigation={navigation} />}
     </>
   )
 }

src/screens/home/v2/component/grid/index.tsx

@@ -9,7 +9,7 @@ import { View } from 'react-native'
 import { Loading } from '@components'
 import { obc } from '@utils/decorators'
 import { Ctx } from '../../types'
-import Info from './info'
+import Info from './layout'
 import Linear from './linear'
 import List from './list'
 import { COMPONENT } from './ds'
@@ -20,6 +20,7 @@ const RENDERED = {}
 
 function Grid({ title = '全部' }: Props, { $ }: Ctx) {
   if ($.tabsLabel === title) RENDERED[title] = true
+
   if ($.tabsLabel !== title && !RENDERED[title]) return null
 
   if (!$.collection._loaded) return <Loading />

src/screens/home/v2/component/grid-info/book-next-btn/index.tsx → src/screens/home/v2/component/grid/info/book-next-btn/index.tsx

@@ -7,7 +7,7 @@
 import React from 'react'
 import { Flex, Iconfont, Touchable } from '@components'
 import { obc } from '@utils/decorators'
-import { Ctx } from '../../../types'
+import { Ctx } from '../../../../types'
 import { COMPONENT } from './ds'
 import { styles } from './styles'
 

src/screens/home/v2/component/grid-info/btn-next-ep/index.tsx → src/screens/home/v2/component/grid/info/btn-next-ep/index.tsx

@@ -8,7 +8,7 @@ import React from 'react'
 import { View } from 'react-native'
 import { Flex, Iconfont, Text, Touchable } from '@components'
 import { obc } from '@utils/decorators'
-import { Ctx } from '../../../types'
+import { Ctx } from '../../../../types'
 import { COMPONENT } from './ds'
 import { styles } from './styles'
 

src/screens/home/v2/component/grid-info/count/index.tsx → src/screens/home/v2/component/grid/info/count/index.tsx

@@ -10,7 +10,7 @@ import { _ } from '@stores'
 import { obc } from '@utils/decorators'
 import { MODEL_SUBJECT_TYPE } from '@constants'
 import { SubjectTypeCn } from '@types'
-import { Ctx } from '../../../types'
+import { Ctx } from '../../../../types'
 import BookNextBtn from '../book-next-btn'
 import { COMPONENT } from './ds'
 import { styles } from './styles'

src/screens/home/v2/component/grid-info/cover/index.tsx → src/screens/home/v2/component/grid/info/cover/index.tsx

@@ -8,8 +8,8 @@ import React from 'react'
 import { Cover as CoverComp } from '@components'
 import { _ } from '@stores'
 import { obc } from '@utils/decorators'
-import { Ctx } from '../../../types'
-import { memoStyles as gridItemMemoStyles } from '../../grid-item/styles'
+import { Ctx } from '../../../../types'
+import { memoStyles as gridItemMemoStyles } from '../../item/styles'
 import { COMPONENT } from './ds'
 
 function Cover({ subjectId, subject = {} as any, onPress }, { $ }: Ctx) {

src/screens/home/v2/component/grid/info/ds.ts

@@ -1,18 +1,10 @@
 /*
  * @Author: czy0729
- * @Date: 2022-06-19 21:26:02
- * @Last Modified by: czy0729
- * @Last Modified time: 2022-06-19 21:26:54
+ * @Date: 2024-01-06 01:29:51
+ * @Last Modified by:   czy0729
+ * @Last Modified time: 2024-01-06 01:29:51
  */
 import { rc } from '@utils/dev'
 import { COMPONENT as PARENT } from '../ds'
 
 export const COMPONENT = rc(PARENT, 'Info')
-
-export const PREV_TEXT = {
-  全部: '条目',
-  动画: '番组',
-  书籍: '书籍',
-  三次元: '电视剧',
-  游戏: '游戏'
-} as const

src/screens/home/v2/component/grid-info/eps/index.tsx → src/screens/home/v2/component/grid/info/eps/index.tsx

@@ -7,30 +7,22 @@
 import React from 'react'
 import { View } from 'react-native'
 import { Eps as EpsComp } from '@_'
-import { _, systemStore } from '@stores'
 import { obc } from '@utils/decorators'
 import { InferArray } from '@types'
-import { Ctx } from '../../../types'
+import { Ctx } from '../../../../types'
 import { COMPONENT } from './ds'
 import { styles } from './styles'
 
 function Eps({ subjectId }, { $, navigation }: Ctx) {
-  const { homeGridEpAutoAdjust } = systemStore.setting
   const eps = $.eps(subjectId)
   type Ep = InferArray<typeof eps>
 
   return (
     <View style={styles.eps}>
       <EpsComp
         grid
-        numbersOfLine={
-          _.isMobileLanscape
-            ? 12
-            : homeGridEpAutoAdjust
-            ? _.device($.epsCount(subjectId, false) <= 18 ? 6 : 7, 8)
-            : _.device(7, 8)
-        }
-        lines={_.isMobileLanscape ? 1 : 3}
+        numbersOfLine={$.numbersOfLineGrid(subjectId)}
+        lines={$.linesGrid}
         login={$.isLogin}
         subjectId={subjectId}
         eps={eps}

src/screens/home/v2/component/grid/info/index.tsx

@@ -1,65 +1,75 @@
 /*
  * @Author: czy0729
- * @Date: 2022-11-20 11:15:18
+ * @Date: 2019-10-19 21:28:24
  * @Last Modified by: czy0729
- * @Last Modified time: 2024-03-27 05:39:51
+ * @Last Modified time: 2024-04-08 10:55:53
  */
 import React from 'react'
 import { View } from 'react-native'
-import { Flex, Loading, Mesume, Text } from '@components'
-import { _, systemStore } from '@stores'
+import { Flex, Text } from '@components'
+import { getCoverSrc } from '@components/cover/utils'
+import { _ } from '@stores'
+import { stl } from '@utils'
 import { obc } from '@utils/decorators'
-import { SubjectId } from '@types'
+import { t } from '@utils/fetch'
+import { IMG_WIDTH_SM } from '@constants'
 import { Ctx } from '../../../types'
-import { memoStyles } from '../styles'
-import GridInfo from '../../grid-info'
-import { COMPONENT, PREV_TEXT } from './ds'
-
-function Info({ title }, { $ }: Ctx) {
-  if (!$.collection._loaded) return <Loading />
+import Count from './count'
+import Cover from './cover'
+import Eps from './eps'
+import Onair from './onair'
+import Title from './title'
+import ToolBar from './tool-bar'
+import { COMPONENT } from './ds'
+import { memoStyles } from './styles'
+import { Props } from './types'
 
+function Info(
+  { subjectId = 0, subject = {}, epStatus = '', tip = '', time = '' }: Props,
+  { $, navigation }: Ctx
+) {
   const styles = memoStyles()
-  const { current, grid } = $.state
-  const isGame = title === '游戏'
-  const { list } = $.currentCollection(title)
-  let find = isGame
-    ? grid
-    : list.find((item: { subject_id: SubjectId }) => item.subject_id === current)
-  let tip = ''
-
-  /**
-   * 如果设置开启了全部里显示游戏, 因为两种数据结构不一样,
-   * 需要在确定找到项目后, 使用 $.state.grid
-   */
-  if (title === '全部' && !find && systemStore.setting.showGame) {
-    find = list.find((item: { id: SubjectId }) => item.id == current)
-    if (find) {
-      tip = find?.tip || ''
-      find = grid
-    }
-  } else if (isGame) {
-    tip = $.games.list.find(item => item.id == current)?.tip || ''
-  }
-
+  const isTop = $.state.top.indexOf(subjectId) !== -1
   return (
-    <View style={isGame ? styles.gameInfo : styles.info}>
-      {find ? (
-        <GridInfo
-          subjectId={find.subject_id}
-          subject={find.subject}
-          epStatus={find.ep_status}
-          tip={tip}
-          time={isGame ? find.subject?.time : ''}
+    <Flex style={styles.item} align='start'>
+      <View>
+        <Cover
+          subjectId={subjectId}
+          subject={subject}
+          onPress={() => {
+            t('首页.跳转', {
+              to: 'Subject',
+              from: 'grid',
+              subjectId
+            })
+
+            navigation.push('Subject', {
+              subjectId,
+              _jp: subject.name,
+              _cn: subject.name_cn,
+              _image: getCoverSrc(subject?.images?.medium || '', IMG_WIDTH_SM)
+            })
+          }}
         />
-      ) : (
-        <Flex style={styles.noSelect} justify='center' direction='column'>
-          <Mesume size={80} />
-          <Text style={_.mt.sm} type='sub' align='center'>
-            请先点击下方{PREV_TEXT[title]}
-          </Text>
+        <Onair subjectId={subjectId} />
+      </View>
+      <Flex.Item style={styles.info}>
+        <Title subjectId={subjectId} subject={subject} />
+        <Flex style={stl(_.mt.sm, _.isPad && _.mb.xs)}>
+          <Flex.Item>
+            <Count subjectId={subjectId} subject={subject} epStatus={epStatus} tip={tip} />
+          </Flex.Item>
+          <ToolBar subjectId={subjectId} subject={subject} />
         </Flex>
-      )}
-    </View>
+        <Eps subjectId={subjectId} />
+        {!!time && (
+          <Text style={_.mt.md} size={12} type='sub'>
+            {time} 在玩
+          </Text>
+        )}
+      </Flex.Item>
+      {isTop && <View style={styles.dot} />}
+    </Flex>
   )
 }
 

src/screens/home/v2/component/grid-info/onair/index.tsx → src/screens/home/v2/component/grid/info/onair/index.tsx

@@ -8,7 +8,7 @@ import React from 'react'
 import { Text } from '@components'
 import { _ } from '@stores'
 import { obc } from '@utils/decorators'
-import { Ctx } from '../../../types'
+import { Ctx } from '../../../../types'
 import { COMPONENT } from './ds'
 
 function Onair({ subjectId }, { $ }: Ctx) {

src/screens/home/v2/component/grid-info/styles.ts → src/screens/home/v2/component/grid/info/styles.ts

@@ -5,7 +5,7 @@
  * @Last Modified time: 2022-11-20 10:58:43
  */
 import { _ } from '@stores'
-import { memoStyles as gridItemMemoStyles } from '../grid-item/styles'
+import { memoStyles as gridItemMemoStyles } from '../item/styles'
 
 export const memoStyles = _.memoStyles(() => {
   const itemStyles = gridItemMemoStyles()

src/screens/home/v2/component/grid-info/title/index.tsx → src/screens/home/v2/component/grid/info/title/index.tsx

@@ -8,7 +8,7 @@ import React from 'react'
 import { Text } from '@components'
 import { cnjp, HTMLDecode } from '@utils'
 import { obc } from '@utils/decorators'
-import { Ctx } from '../../../types'
+import { Ctx } from '../../../../types'
 import { COMPONENT } from './ds'
 
 function Title({ subjectId, subject = {} as any }, { $ }: Ctx) {