t

src/components/chat/com.jsx

@@ -71,7 +71,7 @@ export default class Comment extends Component {
       this.callHandle()
     }
   }
-  countHandle (type) {
+  countHandle = (type) => {
     const { curObj, otherObj } = this.state
     let params = {
       target_id: otherObj.id,

src/pagesHouse/produceType.jsx

@@ -6,6 +6,8 @@ import Chat from '@/c/chat/com'
 import LoginJudge from '@/c/login/Judge'
 import './produceType.scss'
 
+import { AtNoticebar } from 'taro-ui'
+
 class Index extends Component {
   onShareAppMessage() {
     const { curId, curObj } = this.state
@@ -47,6 +49,7 @@ class Index extends Component {
   getDtl = () => {
     const { curId } = this.state
     Taro.api.house.admestatedetail({id: curId}).then(res => {
+      console.log(res.area_data)
       this.setState({
         curObj: res || {}
       }, () => {
@@ -81,7 +84,15 @@ class Index extends Component {
     Taro.navigateTo({url: '/pagesHouse/indexDtl?id=' + id})
   }
 
+  linkKefu () {
+    this.subChat.countHandle('chat')
+  }
+  linkLoan () {
+    Taro.navigateTo({url: '/pagesMore/center/loanCalc'})
+  }
+
   renderInfo () {
+    const that = this
     const dictData = Taro.getStorageSync('dictData')
     const hxIcon = require('@img/icon_hx.png')
     const vrIcon = require('@img/icon_vr.png')
@@ -90,6 +101,10 @@ class Index extends Component {
     const htObj = arrToObj(dictData.house_type)
     return (
       <View className="scoped-house-type">
+        <AtNoticebar icon='volume-plus'>说明：按首付2成等额本息商贷利率4.1贷30年计算，首付和月供结果四舍五入，仅供参考。
+          <View className='scoped-notice-more t2' onClick={this.linkKefu.bind(this)}>[免费咨询]</View>
+          <View className='scoped-notice-more' onClick={this.linkLoan.bind(this)}>[房贷计算器]</View>
+         </AtNoticebar>
         {
           (curObj.area_data || []).map(one =>{
             return (
@@ -99,9 +114,9 @@ class Index extends Component {
                   <View className="t">{ptObj[one.product_type_val]}</View>
                 </View>
                 <View className="sht-one-desc">
-                  <View className="op">
+                  {/* <View className="op">
                     参考价格{ } | { } ￥{Number(one.average_price) === 1 ? '待定' : one.average_price}/㎡
-                  </View>
+                  </View> */}
                   <View className="op">
                     梯户比{ } | { } {one.stairs_rate || '未知'}
                   </View>
@@ -110,45 +125,53 @@ class Index extends Component {
                   one.house_type_list.map(two => {
                     return (
                       <View className="sht-two" key={two}>
-                        <View className="sht-two-title"></View>
                         {
                           two.area_list.map(three => {
+                            const mNumObj = three.price ? that.payWayOne(0.041, 0, 30, parseInt(three.price * 0.8 * 10000)) : {}
                             return (
-                              <View className="sht-area" key={three}>
-                                <View className="sa-left" onClick={this.previewImageHandle.bind(this, three.img_url, two.area_list)} >
-                                  <Image className="img" src={three.img_url + '_xs'}/>
-                                  <View className="tips">
-                                    <View className="bg"></View>
-                                    <View className="t">查看大图</View>
-                                  </View>
-                                  {
-                                    three.vr_key
-                                    ? <Image className="vr-icon" src={vrIcon}/>
-                                    : ''
-                                  }
-                                </View>
-                                <View onClick={this.linkVrHandle.bind(this, three)} className="sa-right">
-                                  <View className="op">
-                                    <View className="k">户型</View>
-                                    <View className="v t2">{htObj[two.house_type_val]}</View>
-                                  </View>
-                                  <View className="op">
-                                    <View className="k">建面</View>
-                                    <View className="v">{three.area}㎡</View>
+                              <View className="sht-ops" key={three}>
+                                <View className="sht-area">
+                                  <View className="sa-left" onClick={this.previewImageHandle.bind(this, three.img_url, two.area_list)} >
+                                    <Image className="img" src={three.img_url + '_xs'}/>
+                                    <View className="tips">
+                                      <View className="bg"></View>
+                                      <View className="t">查看大图</View>
+                                    </View>
+                                    {
+                                      three.vr_key
+                                      ? <Image className="vr-icon" src={vrIcon}/>
+                                      : ''
+                                    }
                                   </View>
-                                  <View className="op">
-                                    <View className="k">户型VR</View>
-                                    <View className="v">
-                                      {
-                                        three.vr_key
-                                        ?
-                                        <View className="scoped-vr-btn">点击查看</View>
-                                        :
-                                        '待收集'
-                                      }
+                                  <View onClick={this.linkVrHandle.bind(this, three)} className="sa-right">
+                                    <View className="op">
+                                      <View className="k">户型</View>
+                                      <View className="v t2">{htObj[two.house_type_val]}</View>
+                                    </View>
+                                    <View className="op">
+                                      <View className="k">建面</View>
+                                      <View className="v">{three.area}㎡</View>
+                                    </View>
+                                    <View className="op">
+                                      <View className="k">户型VR</View>
+                                      <View className="v">
+                                        {
+                                          three.vr_key
+                                          ?
+                                          <View className="scoped-vr-btn">点击查看</View>
+                                          :
+                                          '待收集'
+                                        }
+                                      </View>
                                     </View>
                                   </View>
                                 </View>
+                                {
+                                  three.price
+                                  ?
+                                  <AtNoticebar>总价约{three.price}万，约￥{three.unit_price}/㎡。首付{Math.round(three.price * 0.2)}万，月供{Math.round(mNumObj.monthPay)}元</AtNoticebar>
+                                  : ''
+                                }
                               </View>
                             )
                           })
@@ -164,6 +187,72 @@ class Index extends Component {
       </View>
     )
   }
+  linkKefu
+  /**
+ * 纯商贷 等额本息 月供 贷款利息计算
+ * @param {*} rate 国家规定银行贷款基准利率 默认0.049
+ * @param {*} floatRate 贷款银行利率上浮率 0.2
+ * @param {*} year 贷款年限
+ * @param {*} cost 本金
+ */
+  payWayOne(rate, floatRate, year, cost){
+    let realYearRate = rate * ( 1 + floatRate);
+    // console.info('实际年利率', realYearRate);
+    let monthRate = realYearRate / 12;
+    // console.info('实际月利率', monthRate);
+    let monthPay = ( cost * monthRate * Math.pow(1 + monthRate, year * 12) )/( Math.pow( 1 + monthRate , year * 12) - 1);
+    // console.info('月供', monthPay);
+    let totalPay = monthPay * year * 12;
+    // console.info('总计支付', totalPay);
+    let totalInterest = totalPay - cost;
+    // console.info('额外支付', totalInterest);
+    return { cost, year, rate, floatRate, monthRate, monthPay, totalPay, totalInterest};
+  }
+  /**
+ * 纯商贷 等额本金 月供 贷款利息计算
+ * @param {*} rate 国家规定银行贷款基准利率 默认0.049
+ * @param {*} floatRate 贷款银行利率上浮率 0.2
+ * @param {*} year 贷款年限
+ * @param {*} cost 本金
+ * @param {*} payMonth 已付款月数
+ */
+payWayTwo(rate, floatRate, year, cost, payMonth){
+  let realYearRate = rate * ( 1 + floatRate);
+  // console.info('实际年利率', realYearRate);
+  let monthRate = realYearRate / 12;
+  // console.info('实际月利率', monthRate);
+  let monthCost = cost / year / 12;
+  // 累计已支付本金(等额本金--每月本金不变)
+  let payTotal = 0.0
+  let payCost = monthCost * 0;
+  let historyPayCost = 0.0;
+  let historyPayTotal = 0.0;
+  let month = 1;
+  let monthPayDetail = [];
+  while(month <= (year * 12)){
+      let preMonthPay = (cost / (year * 12)) + ( cost - payCost ) * monthRate;
+      if(month <= payMonth){
+          historyPayCost += monthCost; 
+          historyPayTotal += preMonthPay;
+          if(month === payMonth){
+              console.info('当前累计支付', historyPayTotal);
+              console.info('当前累计支付本金', historyPayCost);
+          }
+      }
+      payCost += monthCost;// 已支付本金
+      payTotal += preMonthPay;// 累计支付
+      monthPayDetail.push({ month, monthCost, payCost, payTotal, pay: preMonthPay, interest: (preMonthPay - monthCost), accInterest: (payTotal - payCost) });
+      month++;
+  }
+  console.info('累计支付', payTotal);
+  console.info('累计支付本金', payCost);
+  let totalInterest = payTotal - payCost;
+  console.info('总计支付利息', totalInterest);
+  return { cost, realYearRate, monthRate, monthCost, historyPayCost, historyPayTotal, 
+          payMonth, historyInterest: (historyPayTotal - historyPayCost), 
+          payCost, payTotal, totalInterest,
+          detail: monthPayDetail};    
+  }
   previewImageHandle (cur, arr) {
     const current = `${cur}_plus`
     const urls = arr.map(item => {

src/pagesHouse/produceType.scss

@@ -4,8 +4,17 @@
   padding-top: 156px;
   padding-bottom: 140px;
 }
+.scoped-notice-more {
+  display: inline-block;
+  margin-right: 20px;
+  color: $mainColor;
+  font-weight: bold;
+  &.t2 {
+    color: $successColor;
+  }
+}
 .scoped-house-type {
-  padding: 20px;
+  padding: 0 20px 20px;
   .sht-one-title {
     border-bottom: 1PX solid #f7f7f7;
     padding-bottom: 10px;
@@ -40,8 +49,14 @@
   }
 }
 
+.sht-ops {
+  margin-bottom: 20px;
+  .at-noticebar {
+    margin: -6px 20px 0;
+  }
+}
 .sht-area {
-  padding: 0 20px 20px;
+  padding: 0 20px;
   display: flex;
   .sa-left {
     width: 220px;