- [x] [首页进度、条目] 章节按钮长按切换看过/撤销

- [x] [条目] 优化章节点击 ‘看到’ 之后反馈, 不再需要重复刷新才会更新状态
czy0729 · Sep 5, 2019 · 530c61a · 530c61a
1 parent db5fc63
commit 530c61a
Show file tree

Hide file tree

Showing 9 changed files with 120 additions and 71 deletions.
diff --git a/components/@/ant-design/popover/index.js b/components/@/ant-design/popover/index.js
@@ -81,7 +81,8 @@ export default class Popover extends React.PureComponent {
       disabled,
       triggerStyle,
       styles,
-      placement
+      placement,
+      onLongPress // @add
     } = this.props
     return (
       <WithTheme themeStyles={PopoverStyles} styles={styles}>
@@ -98,6 +99,7 @@ export default class Popover extends React.PureComponent {
                 <TouchableOpacity
                   ref={setPopoverAnchor}
                   onPress={openPopover}
+                  onLongPress={onLongPress} // @add
                   style={triggerStyle}
                   disabled={disabled}
                   activeOpacity={0.75}
@@ -106,7 +108,7 @@ export default class Popover extends React.PureComponent {
                 </TouchableOpacity>
                 <Pop
                   popoverStyle={s.popover}
-                  contentStyle={[s.content, contentStyle]}
+                  contentStyle={[s.content, contentStyle]} // @add
                   arrowStyle={Platform.OS === 'ios' ? s.arrow : s.arrowAndroid}
                   backgroundStyle={s.background}
                   visible={popoverVisible}

diff --git a/components/button.js b/components/button.js
@@ -3,7 +3,7 @@
  * @Author: czy0729
  * @Date: 2019-03-15 02:32:29
  * @Last Modified by: czy0729
- * @Last Modified time: 2019-08-30 18:09:04
+ * @Last Modified time: 2019-09-05 12:10:10
  */
 import React from 'react'
 import { StyleSheet, View } from 'react-native'
@@ -64,6 +64,7 @@ function Button({
           _text
         ]}
         align='center'
+        selectable={false}
       >
         {children}
       </Text>

diff --git a/components/popover/index.android.js b/components/popover/index.android.js
@@ -3,7 +3,7 @@
  * @Author: czy0729
  * @Date: 2019-05-05 02:45:46
  * @Last Modified by: czy0729
- * @Last Modified time: 2019-08-14 10:32:36
+ * @Last Modified time: 2019-09-05 12:14:16
  */
 import React from 'react'
 import { StyleSheet, UIManager, findNodeHandle, View } from 'react-native'
@@ -12,7 +12,8 @@ import Touchable from '../touchable'
 export default class Popover extends React.Component {
   static defaultProps = {
     data: [],
-    onSelect: Function.prototype
+    onSelect: Function.prototype,
+    onLongPress: Function.prototype
   }
 
   ref
@@ -35,11 +36,15 @@ export default class Popover extends React.Component {
   }
 
   render() {
-    const { style, children } = this.props
+    const { style, onLongPress, children } = this.props
     return (
       <View>
         <View ref={ref => (this.ref = ref)} style={styles.overflowView} />
-        <Touchable style={style} onPress={this.showPopupAndroid}>
+        <Touchable
+          style={style}
+          onPress={this.showPopupAndroid}
+          onLongPress={onLongPress}
+        >
           {children}
         </Touchable>
       </View>

diff --git a/navigations.js b/navigations.js
@@ -2,12 +2,12 @@
  * @Author: czy0729
  * @Date: 2019-06-02 14:42:28
  * @Last Modified by: czy0729
- * @Last Modified time: 2019-09-04 22:27:16
+ * @Last Modified time: 2019-09-05 14:22:32
  */
 export default {
   initialRouteName: 'HomeTab', // HomeTab TinygrailOverview TinygrailTrade
   initialRouteParams: {
-    // subjectId: 238923 // 238923 100444 204135
+    // subjectId: 100444 // 238923 100444 204135
     // topicId: 'group/352146' // ep/768491
     // userId: '421853' // '419012'
     // monoId: 'character/11396' // character/70323 person/5745

diff --git a/screens/_/base/eps.js b/screens/_/base/eps.js
@@ -2,7 +2,7 @@
  * @Author: czy0729
  * @Date: 2019-03-15 02:19:02
  * @Last Modified by: czy0729
- * @Last Modified time: 2019-08-31 00:23:36
+ * @Last Modified time: 2019-09-05 12:17:54
  */
 import React from 'react'
 import { StyleSheet, View } from 'react-native'
@@ -27,7 +27,8 @@ class Eps extends React.Component {
     canPlay: false, // 有播放源
     eps: [], // 章节数据
     userProgress: {}, // 用户收藏记录
-    onSelect: Function.prototype // 操作选择
+    onSelect: Function.prototype, // 操作选择
+    onLongPress: Function.prototype // 按钮长按
   }
 
   static pageLimit = 32 // 1页32个
@@ -109,7 +110,7 @@ class Eps extends React.Component {
     return (
       <Menu
         title={[
-          `ep.${item.sort} ${item.name || item.name_cn}`,
+          `ep.${item.sort} ${item.name_cn || item.name}`,
           `${item.airdate} 讨论数：${item.comment}`
         ]}
         data={this.getPopoverData(item)}
@@ -123,7 +124,7 @@ class Eps extends React.Component {
    * @param {*} num  当前第几个
    */
   renderButton(item, num) {
-    const { numbersOfLine, userProgress } = this.props
+    const { numbersOfLine, userProgress, onLongPress } = this.props
     const { width, margin } = this.style
     const isSide = num % numbersOfLine === 0
     const popoverProps = IOS
@@ -141,6 +142,7 @@ class Eps extends React.Component {
           marginRight: isSide ? 0 : margin,
           marginBottom: margin
         }}
+        onLongPress={() => onLongPress(item)}
         {...popoverProps}
       >
         <Button
@@ -333,7 +335,7 @@ const styles = StyleSheet.create({
   }
 })
 
-const getType = (progress, status) => {
+function getType(progress, status) {
   switch (progress) {
     case '想看':
       return 'main'

diff --git a/screens/home/index/item.js b/screens/home/index/item.js
@@ -2,7 +2,7 @@
  * @Author: czy0729
  * @Date: 2019-03-14 15:20:53
  * @Last Modified by: czy0729
- * @Last Modified time: 2019-08-31 00:40:18
+ * @Last Modified time: 2019-09-05 13:54:48
  */
 import React from 'react'
 import { StyleSheet, View } from 'react-native'
@@ -260,6 +260,7 @@ class Item extends React.Component {
               onSelect={(value, item, subjectId) =>
                 $.doEpsSelect(value, item, subjectId, navigation)
               }
+              onLongPress={item => $.doEpsLongPress(item, subjectId)}
             />
           )}
           {top && (

diff --git a/screens/home/index/store.js b/screens/home/index/store.js
@@ -3,7 +3,7 @@
  * @Author: czy0729
  * @Date: 2019-03-21 16:49:03
  * @Last Modified by: czy0729
- * @Last Modified time: 2019-08-31 00:48:21
+ * @Last Modified time: 2019-09-05 14:22:14
  */
 import { observable, computed } from 'mobx'
 import { userStore, subjectStore, collectionStore } from '@stores'
@@ -430,8 +430,8 @@ export default class ScreenHome extends store {
         id: item.id,
         status
       })
-      userStore.fetchUserCollection()
-      userStore.fetchUserProgress()
+      userStore.fetchUserCollection(subjectId)
+      userStore.fetchUserProgress(subjectId)
     }
 
     if (value === '看到') {
@@ -440,13 +440,36 @@ export default class ScreenHome extends store {
         subjectId,
         sort: item.sort
       })
-      userStore.fetchUserCollection()
-      userStore.fetchUserProgress()
+      userStore.fetchUserCollection(subjectId)
+      userStore.fetchUserProgress(subjectId)
     }
 
     // iOS是本集讨论, 安卓是(+N)...
     if (value.includes('本集讨论') || value.includes('(+')) {
       appNavigate(item.url, navigation)
     }
   }
+
+  /**
+   * 章节按钮长按
+   */
+  doEpsLongPress = async ({ id }, subjectId) => {
+    const userProgress = this.userProgress(subjectId)
+
+    let status
+    if (userProgress[id]) {
+      // 已观看 -> 撤销
+      status = MODEL_EP_STATUS.getValue('撤销')
+    } else {
+      // 未观看 -> 看过
+      status = MODEL_EP_STATUS.getValue('看过')
+    }
+
+    await userStore.doUpdateEpStatus({
+      id,
+      status
+    })
+    userStore.fetchUserCollection(subjectId)
+    userStore.fetchUserProgress(subjectId)
+  }
 }
diff --git a/screens/home/subject/ep.js b/screens/home/subject/ep.js
@@ -2,7 +2,7 @@
  * @Author: czy0729
  * @Date: 2019-03-24 04:39:13
  * @Last Modified by: czy0729
- * @Last Modified time: 2019-08-23 00:33:35
+ * @Last Modified time: 2019-09-05 14:04:13
  */
 import React from 'react'
 import { StyleSheet, View } from 'react-native'
@@ -59,6 +59,7 @@ function Ep({ style }, { $, navigation }) {
         userProgress={$.userProgress}
         canPlay={canPlay}
         onSelect={(value, item) => $.doEpsSelect(value, item, navigation)}
+        onLongPress={item => $.doEpsLongPress(item)}
       />
     </View>
   )