lisenzhou 2 年之前
父節點
當前提交
4f05d96e53
共有 1 個檔案被更改,包括 146 行新增108 行删除
  1. 146
    108
      src/pages/index/index.jsx

+ 146
- 108
src/pages/index/index.jsx 查看文件

1
-import { useState, useEffect, useCallback } from 'react'
2
-import { useSelector } from 'react-redux'
3
-import Taro from '@tarojs/taro'
4
-import { ScrollView } from '@tarojs/components'
5
-import withLayout from '@/layout'
6
-import ProjectListItem from '@/components/ProjectListItem/index'
1
+import { useState, useEffect, useCallback } from "react";
2
+import { useSelector } from "react-redux";
3
+import Taro from "@tarojs/taro";
4
+import { ScrollView } from "@tarojs/components";
5
+import withLayout from "@/layout";
6
+import ProjectListItem from "@/components/ProjectListItem/index";
7
 // import ShareToCircle from '@/components/ShareToCircle/index'
7
 // import ShareToCircle from '@/components/ShareToCircle/index'
8
-import FirstScreen from '@/components/FirstScreen'
9
-import { fetch } from '@/utils/request'
10
-import { API_BANNER_LIST, API_INDEX_PROJECTS } from '@/constants/api'
11
-import useParams from '@/utils/hooks/useParams'
12
-import useShare from '@/utils/hooks/useShare'
13
-import useScreen from '@/utils/hooks/useScreen'
14
-import nav2Target from '@/utils/nav2Target'
15
-import ChatIcon from '@/components/ChatIcon/index'
16
-import {  ROLE_CODE } from "@/constants/user";
17
-import Location from './components/Location/index'
18
-import Banner from './components/Banner/index'
19
-import Menu from './components/Menu/index'
20
-import HotRecommend from './components/HotRecommend/index'
21
-import NewestNnews from './components/NewestNnews/index'
22
-import LiveSale from './components/LiveSale/index'
23
-import ColumnTitle from './components/ColumnTitle/index'
24
-import useIndexShareContent from './useIndexShareContent'
25
-
26
-import './index.scss'
27
-
28
-export default withLayout((props) => {
29
-  const { city, router, person, trackData, page, mode } = props
30
-  const isSinglePage = mode === 'singlePage'
31
-  
8
+import FirstScreen from "@/components/FirstScreen";
9
+import { fetch } from "@/utils/request";
10
+import { API_BANNER_LIST, API_INDEX_PROJECTS } from "@/constants/api";
11
+import useParams from "@/utils/hooks/useParams";
12
+import useShare from "@/utils/hooks/useShare";
13
+import useScreen from "@/utils/hooks/useScreen";
14
+import nav2Target from "@/utils/nav2Target";
15
+import ChatIcon from "@/components/ChatIcon/index";
16
+import { ROLE_CODE } from "@/constants/user";
17
+import Location from "./components/Location/index";
18
+import Banner from "./components/Banner/index";
19
+import Menu from "./components/Menu/index";
20
+import HotRecommend from "./components/HotRecommend/index";
21
+import NewestNnews from "./components/NewestNnews/index";
22
+import LiveSale from "./components/LiveSale/index";
23
+import ColumnTitle from "./components/ColumnTitle/index";
24
+import useIndexShareContent from "./useIndexShareContent";
25
+
26
+import "./index.scss";
27
+
28
+export default withLayout(props => {
29
+  const { city, router, person, trackData, page, mode } = props;
30
+  const isSinglePage = mode === "singlePage";
31
+
32
   // 本页面分享或者海报参数
32
   // 本页面分享或者海报参数
33
-  const paramsRef = useParams({person, from: `${page.type}_share`})
34
-  const { miniApp } = useSelector(s => s.user.userInfo)
35
-  const [BannerList, setBannerList] = useState([])
36
-  const [ProjectList, setProjectList] = useState([])
37
-  const [ShowHotRecommend, setShowHotRecommend] = useState(false)
38
-  const [ShowNewestNnews, setShowNewestNnews] = useState(false)
39
-  const [ShowLive, setShowLive] = useState(false)
40
-  const shareContent = useIndexShareContent(miniApp, paramsRef, router)
41
-  
33
+  const paramsRef = useParams({ person, from: `${page.type}_share` });
34
+  const { miniApp } = useSelector(s => s.user.userInfo);
35
+  const [BannerList, setBannerList] = useState([]);
36
+  const [ProjectList, setProjectList] = useState([]);
37
+  const [ShowHotRecommend, setShowHotRecommend] = useState(false);
38
+  const [ShowNewestNnews, setShowNewestNnews] = useState(false);
39
+  const [ShowLive, setShowLive] = useState(false);
40
+  const shareContent = useIndexShareContent(miniApp, paramsRef, router);
41
+
42
   // 开屏广告
42
   // 开屏广告
43
-  const [screenInfo, screenVisible, toggleShowScreen] = useScreen(city.id, person)
43
+  const [screenInfo, screenVisible, toggleShowScreen] = useScreen(
44
+    city.id,
45
+    person
46
+  );
44
 
47
 
45
   // 分享
48
   // 分享
46
-  useShare(shareContent, trackData)
47
-
48
-  const GetBanner = () => { // 获取banner
49
-    fetch({ url: `${API_BANNER_LIST}/banner`, method: 'get', payload: { cityId: city.id, showPosition: 'index' } }).then((res) => {
50
-      setBannerList(res || [])
51
-    })
52
-  }
53
-
54
-  const GetProjectList = () => { // 获取项目列表
55
-    fetch({ url: API_INDEX_PROJECTS, method: 'get', payload: { cityId: city.id, pageNum: 1, pageSize: 20 } }).then((res) => {
56
-      setProjectList(res.records || [])
57
-    })
58
-  }
59
-
60
-  const HotRecommendChange = (e) => {
61
-    setShowHotRecommend(e)
62
-  }
63
-  
64
-  const NewestNnewsChange = (e) => {
65
-    setShowNewestNnews(e)
66
-  }
67
-  
68
-  const LiveChange = (e) => {
69
-    setShowLive(e)
70
-  }
71
-  
49
+  useShare(shareContent, trackData);
50
+
51
+  const GetBanner = () => {
52
+    // 获取banner
53
+    fetch({
54
+      url: `${API_BANNER_LIST}/banner`,
55
+      method: "get",
56
+      payload: { cityId: city.id, showPosition: "index" }
57
+    }).then(res => {
58
+      setBannerList(res || []);
59
+    });
60
+  };
61
+
62
+  const GetProjectList = () => {
63
+    // 获取项目列表
64
+    fetch({
65
+      url: API_INDEX_PROJECTS,
66
+      method: "get",
67
+      payload: { cityId: city.id, pageNum: 1, pageSize: 20 }
68
+    }).then(res => {
69
+      setProjectList(res.records || []);
70
+    });
71
+  };
72
+
73
+  const HotRecommendChange = e => {
74
+    setShowHotRecommend(e);
75
+  };
76
+
77
+  const NewestNnewsChange = e => {
78
+    setShowNewestNnews(e);
79
+  };
80
+
81
+  const LiveChange = e => {
82
+    setShowLive(e);
83
+  };
84
+
72
   const handleScreen = () => {
85
   const handleScreen = () => {
73
-    toggleShowScreen()
74
-    if(person.personType ===ROLE_CODE.BROKER){
75
-      Taro.navigateTo({ url: screenInfo.linkPage })
76
-    }else{
77
-      nav2Target(screenInfo)
86
+    toggleShowScreen();
87
+    if (person.personType === ROLE_CODE.BROKER) {
88
+      if (screenInfo.linkPage) {
89
+        const queryStr = screenInfo.pageParam ? screenInfo.pageParam : "";
90
+        Taro.navigateTo({ url: `${screenInfo.linkPage}?${queryStr}` });
91
+      }
92
+    } else {
93
+      nav2Target(screenInfo);
78
     }
94
     }
79
-    
80
-  }
81
-
95
+  };
82
 
96
 
83
   useEffect(() => {
97
   useEffect(() => {
84
     if (city?.id) {
98
     if (city?.id) {
85
-      GetBanner()
86
-      GetProjectList()
99
+      GetBanner();
100
+      GetProjectList();
87
     }
101
     }
88
-  }, [city?.id])
102
+  }, [city?.id]);
89
 
103
 
90
-  const toBuilingList = useCallback(() => Taro.navigateTo({ url: `/pages/index/buildingList/index` }), [])
104
+  const toBuilingList = useCallback(
105
+    () => Taro.navigateTo({ url: `/pages/index/buildingList/index` }),
106
+    []
107
+  );
91
 
108
 
92
   return (
109
   return (
93
-    <view className='Page Index'>
110
+    <view className="Page Index">
94
       <ChatIcon />
111
       <ChatIcon />
95
-      
112
+
96
       {/* 开屏广告 */}
113
       {/* 开屏广告 */}
97
       <FirstScreen
114
       <FirstScreen
98
         info={screenInfo}
115
         info={screenInfo}
102
       />
119
       />
103
 
120
 
104
       <ScrollView scroll-y>
121
       <ScrollView scroll-y>
105
-        <view className='PageContent'>
106
-
122
+        <view className="PageContent">
107
           {/* 定位 */}
123
           {/* 定位 */}
108
-          <view className='Location'>
124
+          <view className="Location">
109
             <Location></Location>
125
             <Location></Location>
110
           </view>
126
           </view>
111
 
127
 
112
           {/* banner */}
128
           {/* banner */}
113
-          <view className='Banner'>
129
+          <view className="Banner">
114
             <view>
130
             <view>
115
               <view>
131
               <view>
116
                 <Banner List={BannerList}></Banner>
132
                 <Banner List={BannerList}></Banner>
119
           </view>
135
           </view>
120
 
136
 
121
           {/* 菜单 */}
137
           {/* 菜单 */}
122
-          <view className='Menu'>
138
+          <view className="Menu">
123
             <Menu></Menu>
139
             <Menu></Menu>
124
           </view>
140
           </view>
125
 
141
 
126
-           {/* 成交喜报 */}
127
-           {person?.personType===ROLE_CODE.BROKER&&<view className='NewestNnews' style={{display: ShowNewestNnews ? 'block' : 'none'}}>
128
-            {/* <ColumnTitle Name='热门推荐' Icon='icon-shoucang'></ColumnTitle> */}
129
-            <NewestNnews change={NewestNnewsChange}></NewestNnews>
130
-          </view>}
131
-          
142
+          {/* 成交喜报 */}
143
+          {person?.personType === ROLE_CODE.BROKER && (
144
+            <view
145
+              className="NewestNnews"
146
+              style={{ display: ShowNewestNnews ? "block" : "none" }}
147
+            >
148
+              {/* <ColumnTitle Name='热门推荐' Icon='icon-shoucang'></ColumnTitle> */}
149
+              <NewestNnews change={NewestNnewsChange}></NewestNnews>
150
+            </view>
151
+          )}
152
+
132
           {/* 热门推荐 */}
153
           {/* 热门推荐 */}
133
-          <view className='HotRecommend' style={{display: ShowHotRecommend ? 'block' : 'none'}}>
134
-            <ColumnTitle Name='热门推荐' Icon='icon-shoucang'></ColumnTitle>
154
+          <view
155
+            className="HotRecommend"
156
+            style={{ display: ShowHotRecommend ? "block" : "none" }}
157
+          >
158
+            <ColumnTitle Name="热门推荐" Icon="icon-shoucang"></ColumnTitle>
135
             <HotRecommend change={HotRecommendChange}></HotRecommend>
159
             <HotRecommend change={HotRecommendChange}></HotRecommend>
136
           </view>
160
           </view>
137
 
161
 
138
           {/* 直播购房 */}
162
           {/* 直播购房 */}
139
-          <view className='LiveSale' style={{display: ShowLive ? 'block' : 'none'}}>
140
-            <ColumnTitle Name='直播购房' Icon='icon-yinpin' ShowMore ToMore={() => { Taro.switchTab({ url: `/pages/video/index` }) }}></ColumnTitle>
163
+          <view
164
+            className="LiveSale"
165
+            style={{ display: ShowLive ? "block" : "none" }}
166
+          >
167
+            <ColumnTitle
168
+              Name="直播购房"
169
+              Icon="icon-yinpin"
170
+              ShowMore
171
+              ToMore={() => {
172
+                Taro.switchTab({ url: `/pages/video/index` });
173
+              }}
174
+            ></ColumnTitle>
141
             <LiveSale change={LiveChange}></LiveSale>
175
             <LiveSale change={LiveChange}></LiveSale>
142
           </view>
176
           </view>
143
 
177
 
144
           {/* 全部项目 */}
178
           {/* 全部项目 */}
145
-          <view className='AllProject'>
146
-            <ColumnTitle Name='推荐楼盘' Icon='icon-aixin' ShowMore ToMore={toBuilingList}></ColumnTitle>
147
-            <view className='ProjectList'>
148
-              {
149
-                ProjectList.map((item, index) => (
150
-                  <ProjectListItem Data={item} key={`ProjectListItem-${index}`}></ProjectListItem>
151
-                ))
152
-              }
179
+          <view className="AllProject">
180
+            <ColumnTitle
181
+              Name="推荐楼盘"
182
+              Icon="icon-aixin"
183
+              ShowMore
184
+              ToMore={toBuilingList}
185
+            ></ColumnTitle>
186
+            <view className="ProjectList">
187
+              {ProjectList.map((item, index) => (
188
+                <ProjectListItem
189
+                  Data={item}
190
+                  key={`ProjectListItem-${index}`}
191
+                ></ProjectListItem>
192
+              ))}
153
             </view>
193
             </view>
154
           </view>
194
           </view>
155
 
195
 
156
           {/* bottom */}
196
           {/* bottom */}
157
-          <view className='PageBottom' onClick={toBuilingList}>
197
+          <view className="PageBottom" onClick={toBuilingList}>
158
             <text>点击查看更多</text>
198
             <text>点击查看更多</text>
159
           </view>
199
           </view>
160
-
161
         </view>
200
         </view>
162
       </ScrollView>
201
       </ScrollView>
163
-
164
     </view>
202
     </view>
165
-  )
166
-})
203
+  );
204
+});