xujing 5 年之前
父節點
當前提交
112bc6d3ab

二進制
src/assets/index/background.png 查看文件


二進制
src/assets/index/encyclopedia-icon.png 查看文件


二進制
src/assets/index/forward.png 查看文件


二進制
src/assets/index/inspection.png 查看文件


二進制
src/assets/index/location.png 查看文件


二進制
src/assets/index/mall-icon.png 查看文件


二進制
src/assets/index/map-icon.png 查看文件


二進制
src/assets/index/recommend-icon.png 查看文件


二進制
src/assets/index/search.png 查看文件


+ 81
- 0
src/pages/project/activity/index.js 查看文件

@@ -0,0 +1,81 @@
1
+import Taro, { Component } from '@tarojs/taro'
2
+import { View, Swiper, SwiperItem, Image } from '@tarojs/components'
3
+import { queryHelpGroup } from '@services/news'
4
+import { transferImage } from '@utils/tools'
5
+import ActivityItem from '../../activity/item'
6
+import dayjs from 'dayjs'
7
+import './index.scss'
8
+
9
+const bgImg = require('@assets/index/background.png')
10
+
11
+export default class SwiperBanner extends Component {
12
+
13
+    state = {
14
+        helpGroupList: []
15
+    }
16
+
17
+
18
+    componentWillMount() {
19
+        this.loadHelpGroupList()
20
+    }
21
+
22
+
23
+
24
+    loadHelpGroupList() {
25
+        queryHelpGroup({ cityId: this.props.cityId, buildingId: '' }).then(res => {
26
+            this.setState({
27
+                helpGroupList: res || []
28
+            })
29
+        })
30
+    }
31
+
32
+    render() {
33
+        if (!this.state.helpGroupList.length) return null;
34
+
35
+        return (
36
+            <View className="activity-box" style={`background: url(${transferImage(bgImg)}) no-repeat center;background-size: 100% 100%;`}>
37
+                <View className="section-head">
38
+                    <View className="section-head__title">热门活动 </View>
39
+                    <View className="section-head__more" >
40
+                        查看更多<Text className="iconfont icon-more"></Text>
41
+                    </View>
42
+                </View>
43
+                <ScrollView scrollX>
44
+                    <View className='activity-list'>
45
+                        {
46
+                            this.state.helpGroupList.length > 1 &&
47
+                            this.state.helpGroupList.map((item, index) => (
48
+                                <View className='item' key={index + 'act'}>
49
+                                    {/* {(data.type == 'help' || data.type == 'group') && */}
50
+                                    <View className={item.type == '1' ? 'type' : 'type2'}>{item.type == '1' ? '助力' : '拼团'}</View>
51
+                                    {/* } */}
52
+                                    <Image className="img" src={require('@assets/shop/bg.jpg')}></Image>
53
+                                    <View className="title">破晓·内容生态下半场的版权之道—2019企业啦啦啦啦</View>
54
+                                    <View className="time">参与截止时间</View>
55
+                                    <View className="time">2019年10月20日 10:08:20</View>
56
+                                    <View className="btn nostart">未开始</View>
57
+                                    {/* {item.endDate && */}
58
+                                        {/* <View className={data.activityStatus == 0 ? "btn jionin " : data.activityStatus == 1 ? "btn nostart" : data.activityStatus == 2 ? "btn jioned" : "btn"}>{data.activityStatus == 0 ? "立即参与" : data.activityStatus == 1 ? "未开始" : data.activityStatus == 2 ? "已结束" : "已参与"}</View> */}
59
+                        
60
+                                    {/* } */}
61
+                                </View>
62
+                            ))
63
+                        }
64
+                        {
65
+                            this.state.helpGroupList.length == 1 &&
66
+                            this.state.helpGroupList.map((item, index) => (
67
+                                <ActivityItem
68
+                                    data={item}
69
+                                    key={item.dynamicId}
70
+                                    onClick={this.handleItemClick}>
71
+                                </ActivityItem>
72
+                            ))
73
+                        }
74
+
75
+                    </View>
76
+                </ScrollView>
77
+
78
+            </View>
79
+        )
80
+    }
81
+}

+ 126
- 0
src/pages/project/activity/index.scss 查看文件

@@ -0,0 +1,126 @@
1
+@import "@styles/theme.scss";
2
+@import "@styles/mixins.scss";
3
+
4
+.activity-box{
5
+
6
+    height:626px;
7
+    background:#fff;
8
+    box-shadow:0px 2px 12px 2px rgba(0,0,0,0.08);
9
+    padding: 0 30px;
10
+    border-top:20px solid #f5f5f5;
11
+    position: relative;
12
+    .section-head  {
13
+        display: flex;
14
+        align-items: center;
15
+        justify-content: space-between;
16
+        margin: 30px 0;
17
+     
18
+        .section-head__title {
19
+            font-size: 40px;
20
+            font-weight: 600;
21
+          }
22
+          .section-head__more {
23
+            font-size: 26px;
24
+            color: #A1A1A1;
25
+            display: flex;
26
+            align-items: center;
27
+
28
+      
29
+            .iconfont {
30
+              font-size: 26px;
31
+              color: #A1A1A1;
32
+              font-family: "iconfont" !important;
33
+              margin-left: 6px;
34
+
35
+            }
36
+            .icon-more:before {
37
+                content: "\e636";       
38
+            }
39
+          }
40
+        }
41
+    .activity-list{
42
+        position: relative;
43
+        -webkit-overflow-scrolling: touch;
44
+        overflow: hidden;
45
+        display: inline-flex;
46
+        padding-bottom: 10px;
47
+        .item{
48
+            width:330px;
49
+            height:452px;
50
+            background:#fff;
51
+            box-shadow: 0 4px  8px 0 rgba(0, 0, 0, 0.16);
52
+            margin: 0 20px  0 2px;
53
+            border-radius:12px;
54
+            position: relative;
55
+            .type{
56
+                position: absolute;
57
+                left:0;
58
+                top:0;
59
+                color: #fff;
60
+                background:#F6B61D;
61
+                padding: 10px 36px;
62
+                border-radius: 12px 0 12px 0;
63
+                font-size: 24px;
64
+              }
65
+              .type2{
66
+                position: absolute;
67
+                left:0;
68
+                top:0;
69
+                color: #fff;
70
+                background:#BB9C79;
71
+                padding: 12px 36px;
72
+                border-radius: 12px 0 12px 0;
73
+                font-size: 24px;
74
+            
75
+              }
76
+            .img{
77
+              width: 330px;
78
+              height: 186px;  
79
+              border-radius:12px 12px 0 0;
80
+            }
81
+            .title{
82
+                overflow: hidden;
83
+                text-overflow: ellipsis;
84
+                display: -webkit-box;
85
+                -webkit-line-clamp: 2;
86
+                line-clamp: 2;
87
+                -webkit-box-orient: vertical;
88
+                height: 80px;
89
+                color: #666666;
90
+                font-size: 28px;
91
+                margin: 16px 10px 4px 10px;
92
+            }
93
+            .time{
94
+                color: #999;
95
+                font-size: 24px;
96
+                margin: 4px 10px ;
97
+            }
98
+            .btn {
99
+
100
+                background:#DADADA;
101
+                border-radius:30px;
102
+                text-align: center;
103
+                color: white;
104
+                display: block;
105
+                width: 148px;
106
+                font-size: 26px;
107
+                height: 48px;
108
+                line-height: 48px;
109
+                margin-top: 14px;
110
+                margin: 20px auto;
111
+              }
112
+              .jionin{
113
+                background:#FF6A6A;
114
+              }
115
+                  .nostart {
116
+                
117
+                background:#FDC080;
118
+              }
119
+              .jioned{
120
+                background: #9B9B9B;
121
+              }
122
+        }
123
+        
124
+    }
125
+    
126
+  }

+ 97
- 99
src/pages/project/index.js 查看文件

@@ -4,13 +4,13 @@ import './index.scss'
4 4
 import ProjectItem from './item'
5 5
 import Banner from './banner'
6 6
 import Newsbanner from './newsbanner'
7
-import HelpGroupBanner from './swiper'
7
+import Activity from './activity'
8
+import BannerTwo from './swiper'
8 9
 // import ActivityItem from '../activity/item'
9 10
 import ready from '@utils/ready'
10 11
 import { getLocationCity } from '@services/map'
11
-
12 12
 import { queryBanners, savePoint, updatePoint } from '@services/common'
13
-import { queryNewsList, queryHelpGroup } from '@services/news'
13
+import { queryHelpGroup } from '@services/news'
14 14
 import { queryActivityList } from '@services/activity'
15 15
 import { dispatchCitySelected } from '@actions/city'
16 16
 import { ROLE_CODE, DECREASE_UNREADNUM } from '@constants/user'
@@ -79,7 +79,6 @@ export default class Index extends Component {
79 79
     adImage: advImageOfApp,
80 80
     bannerList: [],
81 81
     helpGroupList: [],
82
-    newsList: [],
83 82
     activityList: [],
84 83
     recordId: null,
85 84
     visBanner: false,
@@ -187,7 +186,6 @@ export default class Index extends Component {
187 186
   loadData() {
188 187
     this.loadBannerList()
189 188
     this.loadHelpGroupList()
190
-    this.loadNewsList()
191 189
     this.loadOpenScreenBanner()
192 190
     // this.loadActivityList()
193 191
     this.loadList()
@@ -259,28 +257,6 @@ export default class Index extends Component {
259 257
   }
260 258
 
261 259
 
262
-  loadNewsList() {
263
-    const { curCity } = this.props
264
-    const payload = {
265
-      pageNumber: 1,
266
-      pageSize: 999
267
-    }
268
-    if (curCity.id) {
269
-      payload.cityId = curCity.id
270
-    }
271
-
272
-    this.setState({
273
-      newsList: [{}]
274
-    }, () => {
275
-      queryNewsList(payload).then(res => {
276
-        this.setState({
277
-          newsList: res.records || []
278
-        })
279
-      })
280
-    })
281
-  }
282
-
283
-
284 260
   loadList() {
285 261
     const { keywords } = this.state
286 262
     const { curCity } = this.props
@@ -328,7 +304,7 @@ export default class Index extends Component {
328 304
       console.log('首页分享')
329 305
     })
330 306
     return {
331
-      title: `${this.props.userInfo.miniApp.name || '橙蕉'} 精准获客平台`,//分享内容
307
+      title: `${this.props.userInfo.miniApp.name || '橙蕉'} 精准获客平台`,//分享内容
332 308
       path: `/pages/project/index?from=share&recommender=${personId}`,//分享地址
333 309
       imageUrl: this.state.shareImg
334 310
     }
@@ -435,9 +411,7 @@ export default class Index extends Component {
435 411
   }
436 412
 
437 413
   handleMaskBannerClick(data) {
438
-
439 414
     this.redirectTo(data)
440
-
441 415
   }
442 416
 
443 417
   handleLocationClick() {
@@ -463,25 +437,11 @@ export default class Index extends Component {
463 437
   // DRIFT: 'drift', // 游客
464 438
   // CUSTOMER: 'customer' // 客户
465 439
   toRecomonedPage() {
466
-    const {
467
-      userInfo: { person: { personType } }
468
-    } = this.props
469 440
 
470
-    if (personType === ROLE_CODE['DRIFT'] || !personType) {
471
-      // 游客或者客户 区别是否有电话
472
-      // this.setState({
473
-      //   achieve: true
474
-      // })
475
-      Taro.navigateTo({
476
-        url: `/pages/agent/recommend/index?type=index&cityId=` + this.props.curCity.id
477
-      })
478
-    } else {
441
+    Taro.navigateTo({
442
+      url: `/pages/agent/recommend/index?type=index&cityId=` + this.props.curCity.id
443
+    })
479 444
 
480
-      Taro.navigateTo({
481
-        url: `/pages/agent/recommend/index?type=index&cityId=` + this.props.curCity.id
482
-      })
483
-      console.log(this.props.curCity.id, "this.props.curCity.id")
484
-    }
485 445
   }
486 446
   toMapHouse() {
487 447
     Taro.navigateTo({
@@ -497,19 +457,11 @@ export default class Index extends Component {
497 457
       url: `/pages/agent/recommend/index?type=index&cityId=` + curCity.id
498 458
     })
499 459
   }
500
-  toNewsList() {
501
-    Taro.getApp().props.projectIndex = 1
502
-    Taro.switchTab({
503
-      url: `/pages/activity/activity`,
504
-      fail: res => {
505
-        Taro.getApp().props.projectIndex = 0
506
-      }
507
-    })
508
-  }
460
+
509 461
 
510 462
   renderProjectList() {
511 463
     const { proList: { records = [] } } = this.props
512
-    const { helpGroupList } = this.state
464
+
513 465
     const list = records.filter(item => item.isMain === 1)
514 466
     console.log(records, 'proList')
515 467
     return (
@@ -519,7 +471,7 @@ export default class Index extends Component {
519 471
             < View className="houses" >
520 472
               <View className="section-head">
521 473
                 <View style="display:flex;align-items:center">
522
-                  <Text className="section-head__title" onClick={this.handleProItemClick}>全部楼盘
474
+                  <Text className="section-head__title" onClick={this.handleProItemClick}>推荐楼盘
523 475
                 </Text>
524 476
                   <Image src={require('@assets/index/map.png')} onClick={this.toMapHouse} className='map-img'></Image>
525 477
                   <Text className='map-txt' onClick={this.toMapHouse}>地图看房</Text>
@@ -542,25 +494,6 @@ export default class Index extends Component {
542 494
           )
543 495
         }
544 496
 
545
-        {
546
-          helpGroupList.length > 0 &&
547
-          <View
548
-            style={{
549
-              position: 'relative', padding: '20px 15px 0 15px'
550
-            }}>
551
-
552
-            <HelpGroupBanner
553
-              style={{
554
-                borderRadius: '6px',
555
-                height: '230rpx'
556
-              }}
557
-              indicatorDots={false}
558
-              list={helpGroupList}
559
-              onClick={this.handleHelpGroupClick}>
560
-            </HelpGroupBanner>
561
-          </View>
562
-        }
563
-
564 497
         <View className="last-text">已经到底了~</View>
565 498
       </Block>
566 499
     )
@@ -592,10 +525,29 @@ export default class Index extends Component {
592 525
       url: '/pages/news/detail/index?id=' + item.newsId
593 526
     })
594 527
   }
528
+  toNewsList() {
529
+    Taro.getApp().props.projectIndex = 1
530
+    Taro.switchTab({
531
+      url: `/pages/activity/activity`,
532
+      fail: res => {
533
+        Taro.getApp().props.projectIndex = 0
534
+      }
535
+    })
536
+  }
537
+  toShopMallPage() {
538
+    Taro.switchTab({
539
+      url: `/pages/shop/index`
540
+    })
541
+  }
542
+  toPolicyPage() {
543
+    Taro.navigateTo({
544
+      url: '/pages/policy/index?from=mine',
545
+    })
546
+  }
595 547
 
596 548
   render() {
597 549
     const { curCity } = this.props
598
-    const { newsList, achieve, adImage } = this.state
550
+    const {  achieve, helpGroupList } = this.state
599 551
     const { userInfo: { person: { personType, phone } } } = this.props
600 552
     const { unReadNum, userInfo: { person } } = this.props
601 553
     return (
@@ -606,18 +558,29 @@ export default class Index extends Component {
606 558
             {!achieve && <ScrollView
607 559
               scrollY
608 560
               className='home'>
561
+              <View className="top-box">
562
+                <View className="search" onClick={this.handleToHouseList}>
563
+                  <Image className="search-icon" src={require('@assets/index/search.png')} />
564
+                  <Input className="search-input" placeholder-style="color:#B8B8B8" placeholder="输入你想查询的楼盘"></Input>
565
+                </View>
566
+                <View className="location" onClick={this.handleLocationClick}>
567
+                  <Image className="location-icon" src={require('@assets/index/location.png')} />
568
+                  <Text className="location-text">{curCity.id ? curCity.shortname : '正在定位'}</Text>
569
+                  <View class="arrow_down"></View>
570
+                </View>
571
+              </View>
609 572
               <View className="section section-top" style={{ marginTop: 0, paddingTop: 0 }}>
610 573
                 <View
611 574
                   style={{
612
-                    height: '600rpx', position: 'relative'
575
+                    height: '464rpx', position: 'relative'
613 576
                   }}>
614 577
                   {
615 578
                     this.state.visBanner && (
616 579
                       <Banner
617 580
                         style={{
618
-                          height: '600rpx'
581
+                          height: '464rpx'
619 582
                         }}
620
-                        indicatorDots={true}
583
+                        indicatorDots={false}
621 584
                         list={this.state.bannerList}
622 585
                         onClick={this.handleBannerClick}
623 586
                         onChange={() => (1)}
@@ -626,18 +589,7 @@ export default class Index extends Component {
626 589
                     )
627 590
                   }
628 591
                 </View>
629
-                <View className="top-box">
630
-                  <View className="search" onClick={this.handleToHouseList}>
631
-                    <Image className="search-icon" src={require('@assets/search.png')} />
632
-                    <Input className="search-input" placeholder-style="color:#fff" placeholder="输入你想查询的楼盘"></Input>
633
-                  </View>
634
-                  <View className="location" onClick={this.handleLocationClick}>
635
-                    <Image className="location-icon" src={require('@assets/map.png')} />
636
-                    <Text className="location-text">{curCity.id ? curCity.name : '正在定位'}</Text>
637
-                  </View>
638
-                </View>
639
-
640
-                {
592
+                {/* {
641 593
                   (personType !== ROLE_CODE['CONSULTANT']) && (
642 594
                     <View className='section sectionn-customer' style={newsList.length ? "padding-bottom:0rpx;" : ""} >
643 595
                       <View className='section-content' onClick={this.toRecomonedPage.bind(this, personType)}>
@@ -660,18 +612,64 @@ export default class Index extends Component {
660 612
                       </View>
661 613
                     </View>
662 614
                   )
663
-                }
615
+                } */}
664 616
 
665 617
               </View>
666
-              <Newsbanner cityId={curCity.id} onClick={this.handleNoticeClick} onClickMore={this.toNewsList} />
618
+              <View className="mune-box" style={personType == ROLE_CODE['CONSULTANT'] ? "padding:0 8%" : ""}>
619
+                <View className="mune-item" onClick={this.toShopMallPage}>
620
+                  <Image src={require('@assets/index/mall-icon.png')} className='icon'></Image>
621
+                  <View className="mune-text">
622
+                    积分商城
623
+                  </View>
624
+                </View>
625
+                <View className="mune-item" onClick={this.toPolicyPage}>
626
+                  <Image src={require('@assets/index/encyclopedia-icon.png')} className='icon'></Image>
627
+                  <View className="mune-text">
628
+                    购房百科
629
+                  </View>
630
+                </View>
631
+                {
632
+                  (personType !== ROLE_CODE['CONSULTANT']) &&
633
+                  <View className="mune-item" onClick={this.toRecomonedPage}>
634
+                    <Image src={require('@assets/index/recommend-icon.png')} className='icon'></Image>
635
+                    <View className="mune-text">
636
+                      推荐客户
637
+                  </View>
638
+                  </View>
639
+                }
640
+                <View className="mune-item" onClick={this.toMapHouse}>
641
+                  <Image src={require('@assets/index/map-icon.png')} className='icon'></Image>
642
+                  <View className="mune-text">
643
+                    地图找房
644
+                  </View>
645
+                </View>
646
+              </View>
647
+              <View style="border-bottom:20rpx solid #f5f5f5">
648
+              {
649
+                helpGroupList.length > 0 &&
650
+                <View
651
+                  style={{
652
+                    position: 'relative', padding: '20px 15px 0 15px'
653
+                  }}>
667 654
 
655
+                  <BannerTwo
656
+                    style={{
657
+                      borderRadius: '6px',
658
+                      height: '230rpx'
659
+                    }}
660
+                    indicatorDots={false}
661
+                    list={helpGroupList}
662
+                    onClick={this.handleHelpGroupClick}>
663
+                  </BannerTwo>
664
+                </View>
665
+              }
666
+              <Newsbanner cityId={curCity.id} onClick={this.handleNoticeClick} onClickMore={this.toNewsList} />
667
+              <Activity cityId={curCity.id} />
668
+              </View >
668 669
               {/* 推荐楼盘 */}
669 670
               {this.renderProjectList()}
670
-
671 671
             </ScrollView>}
672
-            {/* user={person} onSuccess={()=>this.handleAuthPhoneSuccess(curCity) */}
673
-            {/* {achieve && <View style="width:100%;height:100%"><Authorize ></Authorize>  </View>} */}
674
-            {this.state.maskVisible && this.renderMaskBanner()}
672
+            {/* {this.state.maskVisible && this.renderMaskBanner()} */}
675 673
             <View className="chat-box" onClick={this.toChatList}>
676 674
               {unReadNum > 0 && <View className="red-dot"></View >}
677 675
               <Image className='chat-img' src={require('@assets/person/communicate.png')}></Image>

+ 99
- 52
src/pages/project/index.scss 查看文件

@@ -17,66 +17,82 @@
17 17
   width: 100%;
18 18
   align-items: center;
19 19
   justify-content: space-between;
20
-  position: absolute;
21
-  top: 5%;
22
-  left: 0;
23
-  padding: 0 60px;
20
+  padding: 20px 30px;
21
+  background-color: #fff;
22
+  .search {
23
+    height: 60px;
24
+    line-height: 60px;
25
+    background:rgba(0,0,0,0.04);
26
+    -webkit-box-pack: start;
27
+    -webkit-justify-content: flex-start;
28
+    -ms-flex-pack: start;
29
+    border-radius: 30px;
30
+    @extend .flex;
31
+    justify-content: flex-start;
32
+    width: 500px;
33
+    &-icon {
34
+    width: 26px;
35
+    height: 24px;
36
+    margin: 0 16px 0 20px ;
37
+    }
38
+    &-input {
39
+      font-size: 24px;
40
+      color: #B8B8B8;
41
+    }
42
+  }
24 43
   .location {
25 44
     @extend .flex;
26 45
     justify-content: center;
27
-    padding: 0 12px;
28
-    background:rgba(0,0,0,0.2);
29
-    border-radius:12px;
30 46
     height: 60px;
31 47
     line-height: 60px;
32
-    
48
+    width: 154px;
49
+    text-align: center;
33 50
     &-text {
34
-      font-size: 25px;
35
-      padding-left: 13px;
36
-      color: #fff;
51
+      font-size: 26px;
52
+      padding: 0 8px;
53
+      color: $primary-color;
37 54
       @include text-ellipsis; 
38
-      width: 100px;
55
+      max-width: 120px;
39 56
       text-align: center;
40 57
     }
41
-  
42 58
     &-icon {
43 59
       width: 14px;
44 60
       height: 20px;
45 61
       animation: bigger 1s ease 3 both;
46 62
     }
63
+    .arrow_down {
64
+      width: 0;
65
+      height: 0;
66
+      border-left: 8px solid transparent;
67
+      border-right: 8px solid transparent;
68
+      border-top: 8px solid $primary-color;
69
+    }
47 70
   }
48
-  
49
-  .search {
50 71
 
51
-    height: 60px;
52
-    line-height: 60px;
53
-    background:rgba(0,0,0,0.2);
54
-    -webkit-box-pack: start;
55
-    -webkit-justify-content: flex-start;
56
-    -ms-flex-pack: start;
57
-    border-radius: 12px;
58
-    @extend .flex;
59
-    justify-content: flex-start;
60
-    width: 440px;
61
-  
62
-    &-icon {
63
-    width: 26px;
64
-    height: 26px;
65
-    margin: 0 16px 0 20px ;
66
-    }
67
-    &-input {
68
-      font-size: 24px;
69
-      color: #fff;
70
-    }
72
+}
73
+.mune-box{
74
+  width:690px;
75
+  height:188px;
76
+  background:#fff;
77
+  box-shadow:0px 4px 12px 0px rgba(0,0,0,0.12);
78
+  border-radius:12px;
79
+  display: flex;
80
+  align-items: center;
81
+  justify-content: space-between;
82
+  margin: -94px auto 0 auto;
83
+  position: relative;
84
+  .mune-item{
85
+    text-align: center;
86
+    width: 25%;
87
+    .icon{
88
+      width:80px;
89
+      height:80px;
71 90
 
91
+    }
72 92
   }
73 93
 }
74 94
 
75 95
 
76
-
77
-
78
-
79
-
80 96
 .section {
81 97
   background: white;
82 98
   padding: 30px ;
@@ -86,17 +102,20 @@
86 102
 
87 103
     &__title {
88 104
       font-size: 40px;
89
-      font-weight: bold;
105
+      font-weight: 600;
90 106
       // font-family: PingFangSC;
91 107
     }
92 108
 
93 109
     &__more {
94 110
       font-size: 26px;
95
-      color: $text-color-lighter;
111
+      color: #A1A1A1;
112
+      display: flex;
113
+      align-items: center;
96 114
 
97 115
       .iconfont {
98 116
         font-size: 26px;
99
-        color: $text-color-lighter;
117
+        color: #A1A1A1;
118
+        margin-left: 6px;
100 119
       }
101 120
     }
102 121
   }
@@ -106,10 +125,25 @@
106 125
   align-items: center;
107 126
   justify-content: space-between;
108 127
   margin: 30px;
109
-  height:80px;
128
+  height:112px;
110 129
   background:#fff;
111 130
   box-shadow:0px 2px 10px 0px rgba(0,0,0,0.12);
112
-  padding: 0 20px;
131
+  padding:  20px ;
132
+  .left-text{
133
+    padding-right: 20px;
134
+    border-right: 2px solid rgba(0,0,0,0.04);
135
+    .up{
136
+      font-size: 28px;
137
+      color: #F6B61D;
138
+      font-weight: 600;
139
+    }
140
+    .down{
141
+      font-size: 28px;
142
+      color: #888;
143
+      font-weight: 600;
144
+    }
145
+  }
146
+ 
113 147
   .notice-icon{
114 148
     width: 40px ;
115 149
     height: 32px;
@@ -118,12 +152,26 @@
118 152
   }
119 153
   .notice-swiper{
120 154
     height: 80px;
121
-    width: 500px;
122
-    line-height: 80px;
155
+    width: 440px;
156
+    margin-left: 20px;
157
+    .date{
158
+      font-size:22px;
159
+      color:#888;
160
+      display: flex;
161
+      align-items: center;
162
+      line-height: 44px;
163
+      .dot{
164
+        width: 6px;
165
+        height: 6px;
166
+        border-radius: 4px;
167
+        background-color: #F6B61D;
168
+        margin-right: 12px;
169
+      }
170
+    }
123 171
     .notice-text{
124
-      font-size: 28px;
125
-      color: #888888;
126
-      width: 450px;
172
+      font-size: 26px;
173
+      color: #353535;
174
+      width: 390px;
127 175
       @include text-ellipsis;
128 176
     }
129 177
   }
@@ -453,10 +501,9 @@
453 501
 }
454 502
 .last-text{
455 503
   font-size: 28px;
456
-  color: #dcdcdc;
504
+  color: #999;
457 505
   text-align: center;
458
-  margin-bottom: 60px;
459
-  margin-top: 40px;
506
+  margin: 40px 0;
460 507
 }
461 508
 @keyframes moveY {
462 509
   0% {

+ 35
- 30
src/pages/project/newsbanner/index.js 查看文件

@@ -1,6 +1,7 @@
1 1
 import Taro, { Component } from '@tarojs/taro'
2 2
 import { View, Swiper, SwiperItem, Image } from '@tarojs/components'
3 3
 import { queryNewsList } from '@services/news'
4
+import dayjs from 'dayjs'
4 5
 
5 6
 export default class SwiperBanner extends Component {
6 7
   static options = {
@@ -16,36 +17,36 @@ export default class SwiperBanner extends Component {
16 17
   timer = null;
17 18
 
18 19
   componentWillReceiveProps(nextProps) {
19
-    
20
+
20 21
     // if (nextProps.cityId != this.state.lastCity) {
21
-      const payload = {
22
-        pageNumber: 1,
23
-        pageSize: 999,
24
-        cityId: nextProps.cityId,
25
-      }
22
+    const payload = {
23
+      pageNumber: 1,
24
+      pageSize: 999,
25
+      cityId: nextProps.cityId,
26
+    }
26 27
 
27
-      queryNewsList(payload).then(res => {
28
-        if (JSON.stringify(this.state.list) !== JSON.stringify(res.records || [])) {
28
+    queryNewsList(payload).then(res => {
29
+      if (JSON.stringify(this.state.list) !== JSON.stringify(res.records || [])) {
29 30
 
30
-          this.setState({
31
-            list: res.records || [],
32
-            lastCity: nextProps.cityId,
33
-            current: 0,
34
-          }, () => {
35
-            if (this.state.list.length > 1) {
36
-              this.clearTimer()
37
-              this.timer = setInterval(() => {
38
-                let current = this.state.current + 1
39
-                if (current >= this.state.list.length) {
40
-                  current = 0
41
-                }
42
-    
43
-                this.setState({ current })
44
-              }, 3000)
45
-            }
46
-          })
47
-        }
48
-      })  
31
+        this.setState({
32
+          list: res.records || [],
33
+          lastCity: nextProps.cityId,
34
+          current: 0,
35
+        }, () => {
36
+          if (this.state.list.length > 1) {
37
+            this.clearTimer()
38
+            this.timer = setInterval(() => {
39
+              let current = this.state.current + 1
40
+              if (current >= this.state.list.length) {
41
+                current = 0
42
+              }
43
+
44
+              this.setState({ current })
45
+            }, 3000)
46
+          }
47
+        })
48
+      }
49
+    })
49 50
     // }
50 51
   }
51 52
 
@@ -66,12 +67,15 @@ export default class SwiperBanner extends Component {
66 67
     return (
67 68
       <View className="notice-box">
68 69
         <View style="display: flex;align-items: center;">
69
-          <Image className="notice-icon" src={require('@assets/notice.png')}></Image>
70
+          <View className="left-text">
71
+            <View className="up"> 地产</View >
72
+            <View className="down"> 头条</View >
73
+          </View >
74
+
75
+          {/* <Image className="notice-icon" src={require('@assets/notice.png')}></Image> */}
70 76
           <Swiper
71 77
             className='notice-swiper'
72 78
             circular
73
-            // autoplay
74
-            // interval="3000"
75 79
             vertical="true"
76 80
             current={this.state.current}
77 81
           >
@@ -80,6 +84,7 @@ export default class SwiperBanner extends Component {
80 84
                 return (
81 85
                   <SwiperItem key={`news-${inx}`}>
82 86
                     <View className="notice-text" onClick={() => this.props.onClick(item)}>
87
+                    <View className="date"><View className="dot"></View>{dayjs(item.createDate).format('YYYY-MM-DD')}</View>
83 88
                       {item.newsName}
84 89
                     </View>
85 90
                   </SwiperItem>