张延森 5 年之前
父節點
當前提交
a11b398e9d

+ 7
- 1
src/onlineSelling/pages/raiseProfile/Cell.js 查看文件

1
 import { View } from '@tarojs/components'
1
 import { View } from '@tarojs/components'
2
 import './index.scss'
2
 import './index.scss'
3
+import NamedIcon from '../../components/NamedIcon'
3
 
4
 
4
 export default function (props) {
5
 export default function (props) {
5
   const disable = props.disable ? 'disable' : ''
6
   const disable = props.disable ? 'disable' : ''
7
+  console.log('------->', props)
6
 
8
 
7
   return (
9
   return (
8
     <View className={`raiseCell ${disable}`}>
10
     <View className={`raiseCell ${disable}`}>
9
       <View className="row">
11
       <View className="row">
10
         <View className="head">{props.head}</View>
12
         <View className="head">{props.head}</View>
11
         <View className="body">{props.body}</View>
13
         <View className="body">{props.body}</View>
12
-        <View className="action" onClick={props.onActionClick}>{props.action}</View>
14
+        <View className="action" onClick={props.onActionClick}>
15
+          {
16
+            props.action && (<NamedIcon name="copy" size={34} />)
17
+          }
18
+        </View>
13
       </View>
19
       </View>
14
       {
20
       {
15
         props.desc &&
21
         props.desc &&

+ 6
- 1
src/onlineSelling/pages/raiseProfile/CellBlock.js 查看文件

6
   const dataset = props.dataset || []
6
   const dataset = props.dataset || []
7
   const disable = props.disable
7
   const disable = props.disable
8
 
8
 
9
-  const handleActionClick = props.onActionClick || (() => {})
9
+  const handleActionClick = (item) => {
10
+    if (item.action && props.onActionClick) {
11
+      props.onActionClick(item)
12
+    }
13
+  }
10
 
14
 
11
   return (
15
   return (
12
     <View className="cell-block">
16
     <View className="cell-block">
17
               disable={disable}
21
               disable={disable}
18
               head={item.head}
22
               head={item.head}
19
               body={item.body}
23
               body={item.body}
24
+              action={item.action}
20
               desc={item.desc}
25
               desc={item.desc}
21
               onActionClick={handleActionClick.bind(this, item)}
26
               onActionClick={handleActionClick.bind(this, item)}
22
               />
27
               />

+ 75
- 6
src/onlineSelling/pages/raiseProfile/index.js 查看文件

1
 import Taro, { Component } from '@tarojs/taro'
1
 import Taro, { Component } from '@tarojs/taro'
2
-import { View } from '@tarojs/components'
2
+import { View, Block } from '@tarojs/components'
3
 import dayjs from 'dayjs'
3
 import dayjs from 'dayjs'
4
 
4
 
5
-import './index.scss'
6
 import CellBlock from './CellBlock'
5
 import CellBlock from './CellBlock'
7
 import Statement from '../../components/Statement'
6
 import Statement from '../../components/Statement'
8
 import ContactConsultant from '../../components/ContactConsultant'
7
 import ContactConsultant from '../../components/ContactConsultant'
8
+import NamedIcon from '../../components/NamedIcon'
9
+
10
+import './index.scss'
9
 
11
 
10
 export default class extends Component {
12
 export default class extends Component {
11
   config = {
13
   config = {
18
 
20
 
19
   componentWillMount () {}
21
   componentWillMount () {}
20
 
22
 
23
+  // 复制数据
21
   copyData(data) {
24
   copyData(data) {
22
     Taro.setClipboardData({
25
     Taro.setClipboardData({
23
       data,
26
       data,
25
     })
28
     })
26
   }
29
   }
27
 
30
 
31
+  // 跳转去交费
32
+  toPay = () => {
33
+
34
+  }
35
+
36
+  // 查看所有认筹房源
37
+  viewAllHouses = () => {}
38
+
39
+  renderHead() {
40
+    return (
41
+      <View className="head flexSpace">
42
+        <View className="flexSpace-fixed">
43
+          <View className="title">认筹房源</View>
44
+        </View>
45
+        <View className="flexSpace-fixed">
46
+          <View className="gray" onClick={this.viewAllHouses}>
47
+            <Text>查看全部(4)</Text>
48
+            <Text className='at-icon at-icon-chevron-right'></Text>
49
+          </View>
50
+        </View>
51
+      </View>
52
+    )
53
+  }
54
+
55
+  // 取消认购原因
56
+  renderCancelReason() {
57
+    return (
58
+      <Block>
59
+        <View className="cancelReason flexSpace">
60
+          <View className="flexSpace-fixed">
61
+            <NamedIcon name="void" size={120}/>
62
+          </View>
63
+          <View className="flexSpace-item" style="margin-left: 20px">
64
+            <View>认筹单作废原因:</View>
65
+            <View className="gray">认筹单作废原因作废原因原因认筹单作废原因作废原因原因
66
+              认筹单作废原因作废原因原因认筹单作废原因作废原因原因</View>
67
+          </View>
68
+        </View>
69
+        <View className="hr"></View>
70
+      </Block>
71
+    )
72
+  }
73
+
74
+  // 未交费提示
75
+  renderUnpayNotice() {
76
+    return (
77
+      <Block>
78
+        <View className="unpayNotice flexSpace" onClick={this.toPay}>
79
+          <View className="flexSpace-fixed">
80
+            <NamedIcon name="pay" size={64} />
81
+            <View className="a-line txt">未缴费?点我缴费</View>
82
+          </View>
83
+          <View className="flexSpace-fixed">
84
+            <Text className="a-line">认筹金额</Text>
85
+            <Text className="a-line price">30000元</Text>
86
+          </View>
87
+        </View>
88
+        <View className="hr"></View>
89
+      </Block>
90
+    )
91
+  }
92
+
28
   render() {
93
   render() {
29
     const { buildingId } = this.state;
94
     const { buildingId } = this.state;
30
 
95
 
55
     // 其他信息
120
     // 其他信息
56
     const otherInfo = [
121
     const otherInfo = [
57
       { head: '其他信息', body: '供核对数据使用' },
122
       { head: '其他信息', body: '供核对数据使用' },
58
-      { head: '认筹单编号', body: '234567890-09876545678' },
59
-      { head: '缴费单编号', body: '234567890-09876543456' },
60
-      { head: '退费单编号', body: '234567890-09876543456' },
123
+      { head: '认筹单编号', body: '234567890-09876545678', action: true },
124
+      { head: '缴费单编号', body: '234567890-09876543456', action: true },
125
+      { head: '退费单编号', body: '234567890-09876543423', action: true },
61
     ]
126
     ]
62
 
127
 
63
     return (
128
     return (
64
       <View className="raiseProfilePage">
129
       <View className="raiseProfilePage">
65
         <View className="main">
130
         <View className="main">
131
+          {this.renderHead()}
132
+          <View className="tip">注意:请在一个工作日内,到售楼处或项目现场办理认购手续。逾期未办理视为放弃购买。</View>
133
+          {this.renderCancelReason()}
134
+          {this.renderUnpayNotice()}
66
           <View>
135
           <View>
67
             <CellBlock dataset={raiseInfo} />
136
             <CellBlock dataset={raiseInfo} />
68
             <View className="hr" />
137
             <View className="hr" />
70
             <View className="hr" />
139
             <View className="hr" />
71
             <CellBlock dataset={refundInfo} />
140
             <CellBlock dataset={refundInfo} />
72
             <View className="hr" />
141
             <View className="hr" />
73
-            <CellBlock dataset={otherInfo} disable />
142
+            <CellBlock dataset={otherInfo} disable onActionClick={dt => this.copyData(dt.body)} />
74
           </View>
143
           </View>
75
           <View></View>
144
           <View></View>
76
           <View></View>
145
           <View></View>

+ 67
- 0
src/onlineSelling/pages/raiseProfile/index.scss 查看文件

1
+
2
+@import "~taro-ui/dist/style/components/icon.scss";
3
+
1
 .raiseProfilePage {
4
 .raiseProfilePage {
2
 
5
 
3
   .main {
6
   .main {
4
     padding: 0 30px;
7
     padding: 0 30px;
8
+    font-size: 30px;
9
+
10
+    .head {
11
+      margin: 40px 0 30px;
12
+    }
13
+
14
+    .title {
15
+      font-weight: 700;
16
+    }
17
+
18
+    .tip {
19
+      font-size: 24px;
20
+      line-height: 36px;
21
+      color: #FF3C3C;
22
+    }
23
+
24
+    .cancelReason {
25
+      font-size: 21px;
26
+      line-height: 32px;
27
+      color: #333;
28
+      margin: 40px 0 30px;
29
+    }
30
+
31
+    .unpayNotice {
32
+      margin: 30px 0 20px;
33
+      font-size: 28px;
34
+      color: #333;
35
+
36
+      .a-line {
37
+        display: inline-block;
38
+        height: 64px;
39
+        line-height: 64px;
40
+        vertical-align: bottom;
41
+      }
42
+
43
+      .txt {
44
+        margin-left: 10px;
45
+        font-size: 30px;
46
+        color: #666;
47
+      }
48
+
49
+      .price {
50
+        margin-left: 20px;
51
+        font-size: 44px;
52
+        color: #FF3C3C;
53
+      }
54
+    }
55
+
56
+    .gray {
57
+      color: #999;
58
+    }
5
   }
59
   }
6
 
60
 
7
   .hr {
61
   .hr {
11
 
65
 
12
   .contact {
66
   .contact {
13
     margin: 44px 0;
67
     margin: 44px 0;
68
+  } 
69
+}
70
+
71
+.flexSpace {
72
+  display: flex;
73
+  justify-content: space-between;
74
+
75
+  &-fixed {
76
+    flex: none;
77
+  }
78
+
79
+  &-item {
80
+    flex: auto;
14
   }
81
   }
15
 }
82
 }
16
 
83