feat(关注列表与粉丝列表): 新增下拉加载

lsqy · Sep 27, 2019 · 5830b1b · 5830b1b
1 parent 3625a5a
commit 5830b1b
Show file tree

Hide file tree

Showing 12 changed files with 263 additions and 128 deletions.
diff --git a/config/index.js b/config/index.js
@@ -1,3 +1,4 @@
+const path = require('path');
 const config = {
   projectName: 'taro-music',
   date: '2019-3-19',
@@ -26,6 +27,9 @@ const config = {
   },
   defineConstants: {
   },
+  alias: {
+    '@': path.resolve(__dirname, '..', 'src')
+  },
   copy: {
     patterns: [
     ],

diff --git a/package.json b/package.json
@@ -1,73 +1,73 @@
 {
-	"name": "taro-music",
-	"version": "1.0.0",
-	"private": true,
-	"description": "",
-	"scripts": {
-		"build:weapp": "taro build --type weapp",
-		"build:swan": "taro build --type swan",
-		"build:alipay": "taro build --type alipay",
-		"build:tt": "taro build --type tt",
-		"build:h5": "taro build --type h5",
-		"build:rn": "taro build --type rn",
-		"dev:weapp": "npm run build:weapp -- --watch",
-		"dev:swan": "npm run build:swan -- --watch",
-		"dev:alipay": "npm run build:alipay -- --watch",
-		"dev:tt": "npm run build:tt -- --watch",
-		"dev:h5": "npm run build:h5 -- --watch",
-		"dev:rn": "npm run build:rn -- --watch",
-		"commit": "git-cz"
-	},
-	"author": "",
-	"license": "MIT",
-	"dependencies": {
-		"@tarojs/async-await": "1.3.10",
-		"@tarojs/components": "1.3.10",
-		"@tarojs/redux": "1.3.10",
-		"@tarojs/redux-h5": "1.3.10",
-		"@tarojs/router": "1.3.10",
-		"@tarojs/taro": "1.3.10",
-		"@tarojs/taro-alipay": "1.3.10",
-		"@tarojs/taro-h5": "1.3.10",
-		"@tarojs/taro-swan": "1.3.10",
-		"@tarojs/taro-tt": "1.3.10",
-		"@tarojs/taro-weapp": "1.3.10",
-		"classnames": "^2.2.6",
-		"nerv-devtools": "^1.4.3",
-		"nervjs": "^1.4.3",
-		"redux": "^4.0.0",
-		"redux-logger": "^3.0.6",
-		"redux-thunk": "^2.3.0",
-		"taro-ui": "^2.0.2"
-	},
-	"devDependencies": {
-		"@tarojs/plugin-babel": "1.3.10",
-		"@tarojs/plugin-csso": "1.3.10",
-		"@tarojs/plugin-less": "1.3.10",
-		"@tarojs/plugin-sass": "1.3.10",
-		"@tarojs/plugin-uglifyjs": "1.3.10",
-		"@tarojs/webpack-runner": "1.3.10",
-		"@types/react": "^16.4.8",
-		"@types/webpack-env": "^1.13.6",
-		"babel-eslint": "^8.2.3",
-		"babel-plugin-transform-class-properties": "^6.24.1",
-		"babel-plugin-transform-decorators-legacy": "^1.3.4",
-		"babel-plugin-transform-jsx-stylesheet": "^0.6.5",
-		"babel-plugin-transform-object-rest-spread": "^6.26.0",
-		"babel-preset-env": "^1.6.1",
-		"commitizen": "^4.0.3",
-		"cz-conventional-changelog": "^3.0.2",
-		"eslint": "^4.19.1",
-		"eslint-config-taro": "1.3.10",
-		"eslint-plugin-import": "^2.12.0",
-		"eslint-plugin-react": "^7.8.2",
-		"eslint-plugin-taro": "1.3.10",
-		"eslint-plugin-typescript": "^0.12.0",
-		"typescript": "^3.0.1"
-	},
-	"config": {
-		"commitizen": {
-			"path": "node_modules/cz-conventional-changelog"
-		}
-	}
+  "name": "taro-music",
+  "version": "1.0.0",
+  "private": true,
+  "description": "",
+  "scripts": {
+    "build:weapp": "taro build --type weapp",
+    "build:swan": "taro build --type swan",
+    "build:alipay": "taro build --type alipay",
+    "build:tt": "taro build --type tt",
+    "build:h5": "taro build --type h5",
+    "build:rn": "taro build --type rn",
+    "dev:weapp": "npm run build:weapp -- --watch",
+    "dev:swan": "npm run build:swan -- --watch",
+    "dev:alipay": "npm run build:alipay -- --watch",
+    "dev:tt": "npm run build:tt -- --watch",
+    "dev:h5": "npm run build:h5 -- --watch",
+    "dev:rn": "npm run build:rn -- --watch",
+    "commit": "git-cz"
+  },
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "@tarojs/async-await": "1.3.19",
+    "@tarojs/components": "1.3.19",
+    "@tarojs/redux": "1.3.19",
+    "@tarojs/redux-h5": "1.3.19",
+    "@tarojs/router": "1.3.19",
+    "@tarojs/taro": "1.3.19",
+    "@tarojs/taro-alipay": "1.3.19",
+    "@tarojs/taro-h5": "1.3.19",
+    "@tarojs/taro-swan": "1.3.19",
+    "@tarojs/taro-tt": "1.3.19",
+    "@tarojs/taro-weapp": "1.3.19",
+    "classnames": "^2.2.6",
+    "nerv-devtools": "^1.4.6",
+    "nervjs": "^1.4.6",
+    "redux": "^4.0.0",
+    "redux-logger": "^3.0.6",
+    "redux-thunk": "^2.3.0",
+    "taro-ui": "^2.2.2"
+  },
+  "devDependencies": {
+    "@tarojs/plugin-babel": "1.3.19",
+    "@tarojs/plugin-csso": "1.3.19",
+    "@tarojs/plugin-less": "1.3.19",
+    "@tarojs/plugin-sass": "1.3.19",
+    "@tarojs/plugin-uglifyjs": "1.3.19",
+    "@tarojs/webpack-runner": "1.3.19",
+    "@types/react": "^16.4.8",
+    "@types/webpack-env": "^1.13.6",
+    "babel-eslint": "^8.2.3",
+    "babel-plugin-transform-class-properties": "^6.24.1",
+    "babel-plugin-transform-decorators-legacy": "^1.3.4",
+    "babel-plugin-transform-jsx-stylesheet": "^0.6.5",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
+    "babel-preset-env": "^1.6.1",
+    "commitizen": "^4.0.3",
+    "cz-conventional-changelog": "^3.0.2",
+    "eslint": "^4.19.1",
+    "eslint-config-taro": "1.3.19",
+    "eslint-plugin-import": "^2.12.0",
+    "eslint-plugin-react": "^7.8.2",
+    "eslint-plugin-taro": "1.3.19",
+    "eslint-plugin-typescript": "^0.12.0",
+    "typescript": "^3.0.1"
+  },
+  "config": {
+    "commitizen": {
+      "path": "node_modules/cz-conventional-changelog"
+    }
+  }
 }
diff --git a/project.config.json b/project.config.json
@@ -1,13 +1,16 @@
 {
-  "miniprogramRoot": "./dist",
-  "projectname": "taro-music",
-  "description": "",
-  "appid": "wxd50c761c9bb71742",
-  "setting": {
-    "urlCheck": false,
-    "es6": false,
-    "postcss": false,
-    "minified": false
-  },
-  "compileType": "miniprogram"
-}
+	"miniprogramRoot": "dist/",
+	"projectname": "taro-music",
+	"description": "",
+	"appid": "wxd50c761c9bb71742",
+	"setting": {
+		"urlCheck": false,
+		"es6": false,
+		"postcss": false,
+		"minified": false
+	},
+	"compileType": "miniprogram",
+	"simulatorType": "wechat",
+	"simulatorPluginLibVersion": {},
+	"condition": {}
+}
diff --git a/src/app.tsx b/src/app.tsx
@@ -33,7 +33,7 @@ class App extends Component {
       'pages/my/index',
       'pages/videoDetail/index',
       'pages/search/index',
-
+      'pages/user/index',
 
 
 

diff --git a/src/components/CUserListItem/index.tsx b/src/components/CUserListItem/index.tsx
@@ -9,20 +9,28 @@ type Props = {
     avatarUrl: string,
     nickname: string,
     signature?: string,
-    gender: number
-  }
+    gender: number,
+    userId: number
+  },
+  clickFunc?: (number) => any
 }
 
 export default class CUserListItem extends Component<Props, {}> {
 
   componentWillMount() {
   }
 
+  goDetail() {
+    if (this.props.clickFunc) {
+      this.props.clickFunc(this.props.userInfo.userId)
+    }
+  }
+
   render() {
     const { userInfo } = this.props
     if (!userInfo) return null
     return (
-        <View className='userListItem_components'>
+        <View className='userListItem_components' onClick={this.goDetail.bind(this)}>
             <Image 
 							src={userInfo.avatarUrl}
 							className='userListItem__avatar'

diff --git a/src/pages/my/index.tsx b/src/pages/my/index.tsx
@@ -40,16 +40,17 @@ type PageState = {
       account: {
         id: number
       },
+      level: number,
       profile: {
         avatarUrl: string,
         backgroundUrl: string,
         nickname: string,
         eventCount: number,
         follows: number,
-        followeds: number
+        followeds: number,
+        userId: number
       }
     },
-    userLevel: number,
     current: number,
     userCreateList: Array<ListItemInfo>,
     userCollectList: Array<ListItemInfo>,
@@ -90,7 +91,6 @@ class Page extends Component<IProps, PageState> {
     super(props)
     this.state = {
       userInfo: Taro.getStorageSync('userInfo'),
-      userLevel: 0,
       current: 1,
       userCreateList: [],
       userCollectList: [],
@@ -119,26 +119,27 @@ class Page extends Component<IProps, PageState> {
   componentDidHide () { }
 
   getUserDetail() {
-    const { id } = this.state.userInfo.account
+    const { userId } = this.state.userInfo.profile
     api.get('/user/detail', {
-      uid: id
+      uid: userId
     }).then((res) => {
+      res.data
       this.setState({
-        userLevel: res.data.level
+        userInfo: res.data
       })
     })
   }
 
   getPlayList() {
-    const { id } = this.state.userInfo.account
+    const { userId } = this.state.userInfo.profile
     api.get('/user/playlist', {
-      uid: id,
+      uid: userId,
       limit: 300
     }).then((res) => {
       if (res.data.playlist && res.data.playlist.length > 0) {
         this.setState({
-          userCreateList: res.data.playlist.filter(item => item.userId === id),
-          userCollectList: res.data.playlist.filter(item => item.userId !== id),
+          userCreateList: res.data.playlist.filter(item => item.userId === userId),
+          userCollectList: res.data.playlist.filter(item => item.userId !== userId),
         })
       }
     })
@@ -164,6 +165,14 @@ class Page extends Component<IProps, PageState> {
     })
   }
 
+  goUserDetail() {
+    return
+    // const { userId } = this.state.userInfo.profile
+    // Taro.navigateTo({
+    //   url: `/pages/user/index?id=${userId}`
+    // })
+  }
+
   goSearch() {
     // Taro.showToast({
     //   title: '正在开发，敬请期待',
@@ -197,7 +206,7 @@ class Page extends Component<IProps, PageState> {
   }
 
   render () {
-    const { userInfo, userLevel, userCreateList, userCollectList, searchValue } = this.state
+    const { userInfo, userCreateList, userCollectList, searchValue } = this.state
     return (
       <View className={classnames({
         my_container: true,
@@ -213,14 +222,14 @@ class Page extends Component<IProps, PageState> {
           />
         </View>
         <View className='header'>
-          <View className='header__left'>
+          <View className='header__left' onClick={this.goUserDetail.bind(this)}>
             <Image src={userInfo.profile.avatarUrl} className='header__img' />
             <View className='header__info'>
               <View className='header__info__name'>
                 {userInfo.profile.nickname}
               </View>
               <View>
-                <Text className='header__info__level'>LV.{userLevel}</Text>
+                <Text className='header__info__level'>LV.{userInfo.level}</Text>
               </View>
             </View>
           </View>

diff --git a/src/pages/myFans/index.scss b/src/pages/myFans/index.scss
@@ -1,3 +1,8 @@
 .my_fans_container {
   padding: 0 30px 30px 30px;
+  height: 100%;
+  box-sizing: border-box;
+  .user_list {
+    height: 100%;
+  }
 }