bug fix

src/onlineSelling/pages/raiseProfile/Cell.js

@@ -1,15 +1,21 @@
 import { View } from '@tarojs/components'
 import './index.scss'
+import NamedIcon from '../../components/NamedIcon'
 
 export default function (props) {
   const disable = props.disable ? 'disable' : ''
+  console.log('------->', props)
 
   return (
     <View className={`raiseCell ${disable}`}>
       <View className="row">
         <View className="head">{props.head}</View>
         <View className="body">{props.body}</View>
-        <View className="action" onClick={props.onActionClick}>{props.action}</View>
+        <View className="action" onClick={props.onActionClick}>
+          {
+            props.action && (<NamedIcon name="copy" size={34} />)
+          }
+        </View>
       </View>
       {
         props.desc &&

src/onlineSelling/pages/raiseProfile/CellBlock.js

@@ -6,7 +6,11 @@ export default function(props) {
   const dataset = props.dataset || []
   const disable = props.disable
 
-  const handleActionClick = props.onActionClick || (() => {})
+  const handleActionClick = (item) => {
+    if (item.action && props.onActionClick) {
+      props.onActionClick(item)
+    }
+  }
 
   return (
     <View className="cell-block">
@@ -17,6 +21,7 @@ export default function(props) {
               disable={disable}
               head={item.head}
               body={item.body}
+              action={item.action}
               desc={item.desc}
               onActionClick={handleActionClick.bind(this, item)}
               />

src/onlineSelling/pages/raiseProfile/index.js

@@ -1,11 +1,13 @@
 import Taro, { Component } from '@tarojs/taro'
-import { View } from '@tarojs/components'
+import { View, Block } from '@tarojs/components'
 import dayjs from 'dayjs'
 
-import './index.scss'
 import CellBlock from './CellBlock'
 import Statement from '../../components/Statement'
 import ContactConsultant from '../../components/ContactConsultant'
+import NamedIcon from '../../components/NamedIcon'
+
+import './index.scss'
 
 export default class extends Component {
   config = {
@@ -18,6 +20,7 @@ export default class extends Component {
 
   componentWillMount () {}
 
+  // 复制数据
   copyData(data) {
     Taro.setClipboardData({
       data,
@@ -25,6 +28,68 @@ export default class extends Component {
     })
   }
 
+  // 跳转去交费
+  toPay = () => {
+
+  }
+
+  // 查看所有认筹房源
+  viewAllHouses = () => {}
+
+  renderHead() {
+    return (
+      <View className="head flexSpace">
+        <View className="flexSpace-fixed">
+          <View className="title">认筹房源</View>
+        </View>
+        <View className="flexSpace-fixed">
+          <View className="gray" onClick={this.viewAllHouses}>
+            <Text>查看全部（4）</Text>
+            <Text className='at-icon at-icon-chevron-right'></Text>
+          </View>
+        </View>
+      </View>
+    )
+  }
+
+  // 取消认购原因
+  renderCancelReason() {
+    return (
+      <Block>
+        <View className="cancelReason flexSpace">
+          <View className="flexSpace-fixed">
+            <NamedIcon name="void" size={120}/>
+          </View>
+          <View className="flexSpace-item" style="margin-left: 20px">
+            <View>认筹单作废原因：</View>
+            <View className="gray">认筹单作废原因作废原因原因认筹单作废原因作废原因原因
+              认筹单作废原因作废原因原因认筹单作废原因作废原因原因</View>
+          </View>
+        </View>
+        <View className="hr"></View>
+      </Block>
+    )
+  }
+
+  // 未交费提示
+  renderUnpayNotice() {
+    return (
+      <Block>
+        <View className="unpayNotice flexSpace" onClick={this.toPay}>
+          <View className="flexSpace-fixed">
+            <NamedIcon name="pay" size={64} />
+            <View className="a-line txt">未缴费？点我缴费</View>
+          </View>
+          <View className="flexSpace-fixed">
+            <Text className="a-line">认筹金额</Text>
+            <Text className="a-line price">30000元</Text>
+          </View>
+        </View>
+        <View className="hr"></View>
+      </Block>
+    )
+  }
+
   render() {
     const { buildingId } = this.state;
 
@@ -55,14 +120,18 @@ export default class extends Component {
     // 其他信息
     const otherInfo = [
       { head: '其他信息', body: '供核对数据使用' },
-      { head: '认筹单编号', body: '234567890-09876545678' },
-      { head: '缴费单编号', body: '234567890-09876543456' },
-      { head: '退费单编号', body: '234567890-09876543456' },
+      { head: '认筹单编号', body: '234567890-09876545678', action: true },
+      { head: '缴费单编号', body: '234567890-09876543456', action: true },
+      { head: '退费单编号', body: '234567890-09876543423', action: true },
     ]
 
     return (
       <View className="raiseProfilePage">
         <View className="main">
+          {this.renderHead()}
+          <View className="tip">注意：请在一个工作日内，到售楼处或项目现场办理认购手续。逾期未办理视为放弃购买。</View>
+          {this.renderCancelReason()}
+          {this.renderUnpayNotice()}
           <View>
             <CellBlock dataset={raiseInfo} />
             <View className="hr" />
@@ -70,7 +139,7 @@ export default class extends Component {
             <View className="hr" />
             <CellBlock dataset={refundInfo} />
             <View className="hr" />
-            <CellBlock dataset={otherInfo} disable />
+            <CellBlock dataset={otherInfo} disable onActionClick={dt => this.copyData(dt.body)} />
           </View>
           <View></View>
           <View></View>

src/onlineSelling/pages/raiseProfile/index.scss

@@ -1,7 +1,61 @@
+
+@import "~taro-ui/dist/style/components/icon.scss";
+
 .raiseProfilePage {
 
   .main {
     padding: 0 30px;
+    font-size: 30px;
+
+    .head {
+      margin: 40px 0 30px;
+    }
+
+    .title {
+      font-weight: 700;
+    }
+
+    .tip {
+      font-size: 24px;
+      line-height: 36px;
+      color: #FF3C3C;
+    }
+
+    .cancelReason {
+      font-size: 21px;
+      line-height: 32px;
+      color: #333;
+      margin: 40px 0 30px;
+    }
+
+    .unpayNotice {
+      margin: 30px 0 20px;
+      font-size: 28px;
+      color: #333;
+
+      .a-line {
+        display: inline-block;
+        height: 64px;
+        line-height: 64px;
+        vertical-align: bottom;
+      }
+
+      .txt {
+        margin-left: 10px;
+        font-size: 30px;
+        color: #666;
+      }
+
+      .price {
+        margin-left: 20px;
+        font-size: 44px;
+        color: #FF3C3C;
+      }
+    }
+
+    .gray {
+      color: #999;
+    }
   }
 
   .hr {
@@ -11,6 +65,19 @@
 
   .contact {
     margin: 44px 0;
+  } 
+}
+
+.flexSpace {
+  display: flex;
+  justify-content: space-between;
+
+  &-fixed {
+    flex: none;
+  }
+
+  &-item {
+    flex: auto;
   }
 }