房贷计算器微信小程序原生语言

微信小程序： 房贷计算器

效果：

输入 300万

结果

还款明细

一共有3个页面
1、输入页面
2、结果页面
3、详情页面

1 index页面

文件

<view class="text-black">
  <!--房屋总价-->
  <view class="cu-bar bg-white solid-bottom">
    <view class="action text-black">房屋总价</view>
    <view class="action">
      <input type="digit" value="{{zj}}" placeholder="请输入房屋总价" bindinput="iChange1" style="text-align: right;"></input>
      <view class="text-gray margin-left-xs">万元</view>
    </view>
  </view>
  <!--首付比例-->
  <view class="cu-bar bg-white solid-bottom">
    <view class="action text-black">首付比例</view>
    <view class="action">
      <input type="digit" value="{{sf}}" placeholder="请输入首付比例" bindinput="iChange2" style="text-align: right;"></input>
      <view class="text-gray margin-left-xs">%</view>
    </view>
  </view>
  <!--首付金额-->
  <view class="cu-bar bg-white solid-bottom">
    <view class="action text-black">首付金额</view>
    <view class="action">
      <input type="digit" value="{{sfm}}" placeholder="请输入首付金额" bindinput="iChange3" style="text-align: right;"></input>
      <view class="text-gray margin-left-xs">万元</view>
    </view>
  </view>

  <!--商业贷款-->
  <view class="cu-bar bg-white solid-bottom margin-top">
    <view class="action text-black">商业贷款</view>
    <view class="action">
      <view>{{dk1}}</view>
      <view class="text-gray margin-left-xs">万元</view>
    </view>
  </view>
  <!--年限-->
  <view class="cu-bar bg-white solid-bottom">
    <view class="action text-black">商业贷款年限</view>
    <view class="action">
      <slider block-size="20" max="30" value="30" style="width: 370rpx;" bindchange="Schange1" />
      <view>{{y1}}</view>
      <view class="text-gray margin-left-xs">年</view>
    </view>
  </view>
  <!--利率-->
  <view class="cu-bar bg-white solid-bottom">
    <view class="action text-black">商业贷款利率</view>
    <view class="action">
      <input type="digit" value="{{lv1}}" placeholder="请输入商业贷款利率" bindinput="iChange4" style="text-align: right;"></input>
      <view class="text-gray margin-left-xs">%</view>
    </view>
  </view>
  <!--公积金-->
  <view class="cu-bar bg-white solid-bottom margin-top">
    <view class="action text-black">{{isGjj?'不':''}}使用公积金贷款</view>
    <view class="action">
      <switch class="themeColor" bindchange="Schange2" />
    </view>
  </view>

  <view wx:if="{{isGjj}}">
    <view class="cu-bar bg-white solid-bottom ">
      <view class="action text-black">公积金贷款</view>
      <view class="action">
        <input type="digit" value="{{dk2}}" placeholder="公积金贷款上限120万" bindinput="iChange5" style="text-align: right;"></input>
        <view class="text-gray margin-left-xs">万元</view>
      </view>
    </view>

    <view class="cu-bar bg-white solid-bottom">
      <view class="action text-black">公积金贷款年限</view>
      <view class="action">
        <slider block-size="20" max="30" value="30" style="width: 370rpx;" bindchange="Schange3" />
        <view>{{y2}}</view>
        <view class="text-gray margin-left-xs">年</view>
      </view>
    </view>

    <view class="cu-bar bg-white solid-bottom">
      <view class="action text-black">公积金贷款利率</view>
      <view class="action">
        <input type="digit" value="{{lv2}}" placeholder="请输入商业贷款利率" bindinput="iChange6" style="text-align: right;"></input>
        <view class="text-gray margin-left-xs">%</view>
      </view>
    </view>
  </view>

  <view bind:tap="ok">
    <view class="cu-btn bg-themeColor block lg margin radius">计算</view>
  </view>

</view>

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91

文件

const calculate = require('../../../utils/');
const app = getApp();
Page({

  data: {
    sf: 30,
    dk1: 0,
    y1: 30,
    y2: 30,
    lv1: 4.1,
    lv2: 3.1,
    isGjj: false,
  },

  onLoad(o) {
    ({
      title: '房贷计算器',
    })

    if ("zj" in o) {
      let zj = parseFloat();
      let sfm =(zj *  * 0.01);
      ({
        zj: zj,
        sfm: sfm,
        dk1: zj - sfm,
      })
    }
  },

  onShareAppMessage() {},


  //房屋总价
  iChange1(e) {
    ({
      type: 'light',
    })
    let zj = ();
    if (zj > 1000000) {
      ({
        title: '金额过大',
        icon: 'error',
      })
      zj = ;
    }
    let sfm = zj *  * 0.01;
    ({
      zj: zj,
      sfm: sfm,
      dk1: zj - sfm,
    })
  },
  //首付比例
  iChange2(e) {
    ({
      type: 'light',
    })
    let sf = ();
    if (sf > 100) {
      ({
        title: '不超100',
        icon: 'error',
      })
      sf = ;
    }
    let sfm =  * sf * 0.01;
    ({
      sf: sf,
      sfm: sfm,
      dk1: zj - sfm,
    })
  },

  //首付金额
  iChange3(e) {
    ({
      type: 'light',
    })
    let sfm = ();
    let zj = ;
    if (parseFloat(zj) < parseFloat(sfm)) {
      ({
        title: '不超总价',
        icon: 'error',
      })
      sfm = ;
    }
    ({
      sfm: sfm,
      sf: (sfm / zj * 100),
      dk1: zj - sfm,
    })

  },
  //年限
  Schange1(e) {
    ({
      type: 'type',
    })
    ({
      y1: ,
    })
  },
  //年利率
  iChange4(e) {
    ({
      type: 'light',
    })
    let lv = ();
    ({
      lv1: lv
    })
  },
  //开关
  Schange2() {
    ({
      type: 'light',
    })
    let dk1 = .dk1; //商业贷款金额
    let dk2;
    let isGjj = !;
    if (isGjj) { //打开
      if (parseFloat(dk1) > 120) {
        dk1 = dk1 - 120
        dk2 = 120
      } else {
        dk2 = dk1
        dk1 = 0
      }
    } else { //关闭
      dk1 =  - ;
      dk2 = '';
    }
    if (!) {
      dk2 = '';
      dk1 = 0;
    }
    ({
      isGjj: isGjj,
      dk1: dk1,
      dk2: dk2,
    })
  },
  //公积金贷款
  iChange5(e) {
    ({
      type: 'light',
    })
    let dk2 = ();
    if (dk2 > 120) {
      ({
        title: '金额不大于120',
        icon: 'error',
      })
      dk2 = .dk2;
    }

    let dk1 =  -  - dk2;
    if (dk1 < 0) {
      ({
        title: '金额过大',
        icon: 'error',
      })
      dk2 = .dk2;
      dk1 = .dk1;
    }

    ({
      dk2: dk2,
      dk1: dk1
    })

  },

  Schange3(e) {
    ({
      type: 'type',
    })
    ({
      y2: ,
    })
  },

  iChange6(e) {
    ({
      type: 'light',
    })
    let lv2 = ();
    ({
      lv1: lv2
    })
  },

  ok() {
    ({
      type: 'light',
    })
    let zj = ;
    if (!zj) {
      ({
        title: '未输入总价',
        icon: 'error'
      })
      return;
    }
    let data = {}
    data['zj'] = zj;
    data['sf'] = ;
    data['sfm'] = ;

    let isGjj = ;
    let dk1 = .dk1;
    if (dk1 > 0) {
      data['dk1'] = dk1;
      data['lv1'] = .lv1;
      data['y1'] = .y1;
    }

    if (isGjj) {
      let dk2 = .dk2;
      if (dk2 != '' || dk2 > 0) {
        data['dk2'] = dk2;
        data['lv2'] = .lv2;
        data['y2'] = .y2;
      }
    }

     = data;
    ({
      url: '/pages/tool/result/result',
    })


  },

})

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91
• 92
• 93
• 94
• 95
• 96
• 97
• 98
• 99
• 100
• 101
• 102
• 103
• 104
• 105
• 106
• 107
• 108
• 109
• 110
• 111
• 112
• 113
• 114
• 115
• 116
• 117
• 118
• 119
• 120
• 121
• 122
• 123
• 124
• 125
• 126
• 127
• 128
• 129
• 130
• 131
• 132
• 133
• 134
• 135
• 136
• 137
• 138
• 139
• 140
• 141
• 142
• 143
• 144
• 145
• 146
• 147
• 148
• 149
• 150
• 151
• 152
• 153
• 154
• 155
• 156
• 157
• 158
• 159
• 160
• 161
• 162
• 163
• 164
• 165
• 166
• 167
• 168
• 169
• 170
• 171
• 172
• 173
• 174
• 175
• 176
• 177
• 178
• 179
• 180
• 181
• 182
• 183
• 184
• 185
• 186
• 187
• 188
• 189
• 190
• 191
• 192
• 193
• 194
• 195
• 196
• 197
• 198
• 199
• 200
• 201
• 202
• 203
• 204
• 205
• 206
• 207
• 208
• 209
• 210
• 211
• 212
• 213
• 214
• 215
• 216
• 217
• 218
• 219
• 220
• 221
• 222
• 223
• 224
• 225
• 226
• 227
• 228
• 229
• 230
• 231
• 232
• 233
• 234
• 235
• 236
• 237

2、result 页面

文件

<!--月供内容-->
<view class="text-center bg-orange padding">
  <view>月供</view>
  <view class="margin-top-xs">
    <text class="text-bold" style="font-size: 80rpx;">{{}}</text>
    <text>元</text>
  </view>
  <view class="margin-top-xs">
    <text>共支付利息{{}}万元</text>
  </view>

  <view class="flex justify-around align-center margin-top-xl">
    <view>
      <view>房款总额</view>
      <view class="text-lg">{{}}万元</view>
    </view>

    <view>
      <view>首付({{}}%)</view>
      <view class="text-lg">{{}}万元</view>
    </view>

    <view>
      <view>贷款总额</view>
      <view class="text-lg">{{}}万元</view>
    </view>
  </view>
</view>

<!--选择-->
<view class="flex justify-around align-center bg-white1 margin">
  <view class="text-center bg-{{tab==1?'orange':'white'}} padding-lr-xl padding-tb-sm radius" bind:tap="tab" id="1">
    <view>等额本息</view>
    <view class="text-sm margin-top-xs">还款每月相同</view>
  </view>
  <view>
    <view class="bg-orange" style="width: 1rpx;height: 60rpx;opacity: 0.4;"></view>
  </view>
  <view class="text-center bg-{{tab==2?'orange':'white'}} padding-lr-xl padding-tb-sm radius" bind:tap="tab" id="2">
    <view>等额本金</view>
    <view class="text-sm margin-top-xs">还款每月减少</view>
  </view>
</view>

<view class="padding bg-white solid-bottom" wx:for="{{}}" wx:key="index" bind:tap="detail" id="{{index}}">
  <view class="flex justify-between">
    <view class="text-black">
      <text>{{}}</text>
      <text wx:if="{{==2}}">：{{}}万元</text>
    </view>
  </view>
  <view class="flex justify-between align-center margin-top-sm">
    <view>
      <text class="text-gray">贷款年限：</text>
      <text>{{}}年</text>
    </view>

    <view>
      <text class="text-gray">贷款利率：</text>
      <text>{{}}%</text>
    </view>

    <view>
      <text class="cuIcon-right"></text>
    </view>
  </view>

  <view class="margin-top-sm" wx:if="{{==2}}">
    <text class="text-gray">贷款利息：</text>
    <text>{{}}万元</text>
  </view>
</view>


<view bind:tap="ok">
  <view class="cu-btn bg-orange block lg margin radius">重新计算</view>
</view>

<view class="margin-top-xl">
  <view class="margin-left">常见问题：</view>
  <view class="cu-bar text-blue">
    <view class="action" bind:tap="showBx">什么是等额本息？</view>
    <view class="action" bind:tap="showBj">什么是等额本金？</view>
  </view>
</view>

<view class="cu-modal show" wx:if="{{isExp}}">
  <view class="cu-dialog text-left">
    <view class="cu-bar justify-end bg-white">
      <view class="content">
        <text class="text-lg">{{}}</text>
      </view>
      <view class="action" bindtap="hideModal">
        <text class="cuIcon-close text-bold"></text>
      </view>
    </view>

    <view class="margin-lr margin-tb ">
      <view class="margin-top" wx:for="{{}}" wx:key="index">
        <view class="text-bold">{{}}</view>
        <view wx:for="{{}}" wx:key="index">{{item}}</view>
      </view>
    </view>
  </view>
</view>

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91
• 92
• 93
• 94
• 95
• 96
• 97
• 98
• 99
• 100
• 101
• 102
• 103
• 104
• 105

文件

const calculate = require('../../../utils/');
const app = getApp();
Page({
  data: {
    tab: 1,
  },
  onLoad(o) {
    ({
      title: '计算结果',
    })
    (1);
  },
  // 用户点击右上角分享
  onShareAppMessage() {},

  tabFun(tab) {
    let toolInfo = ;

    let info = {
      zj: , //总价
      sf: , //首付比例
      sfm: , //首付额度
      dk: 0, //贷款
      yg: 0, //月供
      lxze: 0, //利息总额
      ljhkze: 0, //累计还款总额
    };

    var arr = new Array();
    //商业贷款
    if ("dk1" in toolInfo) {
      // 1是等额本息 2是等额本金
      let bx = tab == 1 ? (toolInfo.lv1, toolInfo.dk1, toolInfo.y1 * 12) : (toolInfo.lv1, toolInfo.dk1, toolInfo.y1 * 12);

      info['yg'] = parseFloat() + parseFloat(); //月供
      info['lxze'] = parseFloat() + parseFloat(); //利息总额
      info['ljhkze'] = parseFloat() + parseFloat(); //累计还款总额
      info['dk'] = parseFloat() + parseFloat(toolInfo.dk1); //贷款

      let item = {
        name: '商业贷款',
        lv: toolInfo.lv1, //利率
        dk: toolInfo.dk1, //贷款
        y: toolInfo.y1, //年限
        list: , //详情
        lxze: (( * 0.01) * 0.01), //利息总额
      }
      (item);
    }

    //公积金贷款
    if ("dk2" in toolInfo) {
      // 1是等额本息 2是等额本金
      let bx = tab == 1 ? (toolInfo.lv2, toolInfo.dk2, toolInfo.y2 * 12) : (toolInfo.lv2, toolInfo.dk2, toolInfo.y2 * 12);

      info['yg'] = parseFloat() + parseFloat(); //月供
      info['lxze'] = parseFloat() + parseFloat(); //利息总额
      info['ljhkze'] = parseFloat() + parseFloat(); //累计还款总额
      info['dk'] = parseFloat() + parseFloat(toolInfo.dk2); //贷款

      let item = {
        name: '公积金贷款',
        lv: toolInfo.lv2, //利率
        dk: toolInfo.dk2, //贷款
        y: toolInfo.y2, //年限
        list: , //详情
        lxze: (( * 0.01) * 0.01), //利息总额
      }
      (item);
    }

    info['arr'] = arr;
    info['lxze'] = (( * 0.01) * 0.01);
    ({
      info: info
    })
  },

  showBx() {
    ({
      type: 'light',
    })
    ({
      isExp: true,
      explain: {
        name: '等额本息',
        exp: [{
            title: '1、定义',
            val: ['每月还款额相同。本金所占比例逐月递增，利息所占比例逐月递减，月还款金额不变。'],
          },
          {
            title: '2、优点',
            val: ['前期还款压力相对较小，后期随着收入的增加还款压力会更小。'],
          },
          {
            title: '3、缺点',
            val: ['前期的还款大部分为利息，真正还的本金很少而且总体支出的利息多。'],
          },
          {
            title: '4、适合人群',
            val: ['现阶段收入少且稳定，尤其是刚工作不久的年轻人。这类人群前期收入不多，随着年龄的增长和职位的升迁收入和还款能力逐渐增加。'],
          },
        ]
      }
    })
  },

  showBj() {
    ({
      type: 'light',
    })
    ({
      isExp: true,
      explain: {
        name: '等额本金',
        exp: [{
            title: '1、定义',
            val: ['每月还的本金一样。由于总本金逐渐减少，利率也会逐渐减少，每月还款的数额也越来越少。'],
          },
          {
            title: '2、优点',
            val: ['同等贷款年限下，等额本金比等额本息利息少。'],
          },
          {
            title: '3、缺点',
            val: ['还款开始阶段金额较高，压力大。'],
          },
          {
            title: '4、适合人群',
            val: ['①当前收入高、可承受高月供，还款能力强的人。',
              '②年纪较大，收入逐渐减少的人，如退休人士等。', '③极有可能提前还款的购房者。', '④投资性购房者。在贷款时间较短的情况下用等额本金的方式还款，一方面可以节省一部分利息，另一方面可以迅速减少剩余的本金，在有需要的时候将剩余的贷款迅速还完，然后利用房子进行再融资'
            ],
          },
        ]
      }
    })
  },

  hideModal() {
    ({
      type: 'light',
    })
    ({
      isExp: false,
    })
  },
  //等额本息与等额本金切换
  tab(e) {
    ({
      type: 'light',
    })
    let id = parseInt();
    let tab = ;
    if (id != tab) {
      (id);
      ({
        tab: id
      })
    }
  },
  //跳转详情
  detail(e) {
    ({
      type: 'light',
    })
    let index = parseInt();
    let info = ;
    let list = [index].list;
    let arr = new Array();
    let y = new Date().getFullYear();
    let n = 1;
    let m = new Date().getMonth() + 1;
    for (let i = 0; i < ; i++) {
      let item = {};
      //首次添加
      if (i == 0) {
        item['y'] = '第' + n + '年(' + y + ')';
        n++;
        y++;
        (item)
      }
      if (m == 13) {
        item['y'] = '第' + n + '年(' + y + ')';
        m = 1;
        n++;
        y++;
        (item)
      }

      item = {
        qc: m + '月',
        chbj: parseFloat(list[i].chbj).toFixed(0),
        chlx: parseFloat(list[i].chlx).toFixed(0),
        chbx: ((list[i].chbx * 0.01) * 0.01),
        sybj: ((list[i].sybj * 0.01) * 0.01),
      }
      m++;
      (item)
    }
     = arr;
    ({
      url: '/pages/tool/detail/detail?title=' + [index].name,
    })
  },

})

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91
• 92
• 93
• 94
• 95
• 96
• 97
• 98
• 99
• 100
• 101
• 102
• 103
• 104
• 105
• 106
• 107
• 108
• 109
• 110
• 111
• 112
• 113
• 114
• 115
• 116
• 117
• 118
• 119
• 120
• 121
• 122
• 123
• 124
• 125
• 126
• 127
• 128
• 129
• 130
• 131
• 132
• 133
• 134
• 135
• 136
• 137
• 138
• 139
• 140
• 141
• 142
• 143
• 144
• 145
• 146
• 147
• 148
• 149
• 150
• 151
• 152
• 153
• 154
• 155
• 156
• 157
• 158
• 159
• 160
• 161
• 162
• 163
• 164
• 165
• 166
• 167
• 168
• 169
• 170
• 171
• 172
• 173
• 174
• 175
• 176
• 177
• 178
• 179
• 180
• 181
• 182
• 183
• 184
• 185
• 186
• 187
• 188
• 189
• 190
• 191
• 192
• 193
• 194
• 195
• 196
• 197
• 198
• 199
• 200
• 201
• 202
• 203
• 204
• 205
• 206

3、detail页面

文件

<view class="bg-white">
  <view style="display: flex;flex-direction:row;justify-content:space-around;position:fixed;top: 0;width: 100%;">
    <view class="tableTou" style="width: 12%;">期数</view>
    <view class="tableTou" style="width: 22%;">月供本金</view>
    <view class="tableTou" style="width: 22%;">月供利息</view>
    <view class="tableTou" style="width: 22%;">月供</view>
    <view class="tableTou" style="width: 22%;">剩余本金</view>
  </view>
  <view style="padding-top: 70rpx;">
    <view wx:for="{{list}}" wx:key="index" data-index="{{index}}">
      <view class="margin-tb-xs margin-left-xs" wx:if="{{}}">
        <text class="text-sm text-bold">{{}}</text> 
      </view>
      <view style="display: flex;flex-direction:row;justify-content:space-around;" wx:else>
        <view class="tableTR text-sm" style="width: 12%;">{{}}</view>
        <view class="tableTR text-sm" style="width: 22%;">{{}}元</view>
        <view class="tableTR text-sm" style="width: 22%;">{{}}元</view>
        <view class="tableTR text-sm" style="width: 22%;">{{}}万元</view>
        <view class="tableTR text-sm" style="width: 22%;">{{}}万元</view>
      </view>
    </view>
  </view>
</view>
<view class="text-center margin-top">
  <text class="text-gray">-- 我也是有底线的 --</text>
</view>
<view class="cu-tabbar-height"></view>

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27

文件

const app = getApp();
Page({
  data: {},

  onLoad(o) {
    ({
      title: ,
    })
    ({
      list: 
    })
  },

  onShareAppMessage() {},

})

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16

文件

.tableTou {
  border: 1rpx solid #ddd;
  width: 25%;
  height: 70rpx;
  display: flex;
  background-color: #EBEBEB;
  justify-content: center;
  align-items: center;
}

.tableTR {
  border: 1rpx solid #F1F1F1;
  background-color: #FFFFFF;
  padding: 20rpx 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20

calculate 文件

const monthBack = function monthBack(year_lilv, money, month) {
  //money = (money * 10000);
  var active = year_lilv * 10 / 12 * 0.001;
  var t1 = (1 + active, month);
  var t2 = t1 - 1;
  var tmp = t1 / t2;
  //月利率
  var monthratio = active * tmp;
  //每月支付本息
  var monthBack = (money * monthratio).toFixed(2);
  return parseFloat(monthBack).toFixed(0); //月供
}

/**
 * ----等额本息还款计算----
 * @param float year_lilv 年利率%
 * @param float money 贷款金额/万
 * @param float month 贷款期限/月
 * @returns array 计算结果 array[{},{}];
 */
const mydebx = function mydebx(year_lilv, money, month) {
  money = (money * 10000);
  var active = year_lilv * 10 / 12 * 0.001;
  var t1 = (1 + active, month);
  var t2 = t1 - 1;
  var tmp = t1 / t2;
  //月利率
  var monthratio = active * tmp;
  //每月支付本息
  var monthBack = (money * monthratio).toFixed(2);
  //百分比
  year_lilv = year_lilv * 0.01;
  var yue_lilv = ((year_lilv / 12));
  //等额本息结果二维数组
  var objArray = new Array();
  //累积偿还本金
  var ljch_bj = 0;
  //上一个月剩余本金
  var pre_sybj = 0;
  var i = 1;
  //等额本息
  for (i = 1; i <= month; i++) {
    //声明二维，每一个一维数组里面的一个元素都是一个数组；
    objArray[i - 1] = new Array();
    //期次
    objArray[i - 1]['qc'] = i;
    //第i个月，偿还本息（元） 月供
    objArray[i - 1]['chbx'] = monthBack;
    //第一个月
    if (i == 1) {
      pre_sybj = money;
    } else {
      pre_sybj = objArray[i - 2]['sybj'];
    }
    //第i个月，偿还利息（元）每月付息额 =（贷款本金-已还清贷款本金）×月利率
    objArray[i - 1]['chlx'] = (pre_sybj * yue_lilv).toFixed(2);
    //第i个月，偿还本金（元）
    var chbj = (objArray[i - 1]['chbx'] - objArray[i - 1]['chlx']);
    objArray[i - 1]['chbj'] = (2);
    ljch_bj += chbj;
    var sybj = (money - ljch_bj);
    //第i个月，剩余本金（元）
    objArray[i - 1]['sybj'] = (2);
    //最后一个月出现小于1元的值
    if (sybj <= 1) {
      //第i个月，剩余本金（元）
      objArray[i - 1]['sybj'] = 0.00;
    }
  }

  let ljhkze = monthBack * month;
  return {
    yg: parseFloat(monthBack).toFixed(0), //月供
    ljhkze: parseFloat(ljhkze).toFixed(0), //累计还款总额
    lxze: parseFloat(ljhkze - money).toFixed(0), //利息总额
    list: objArray, //详情数组消息
  }
}


/**
 * ----等额本金还款法----
 * @param float year_lilv 年利率
 * @param float money 贷款金额/万
 * @param float month 贷款期限/月
 * @returns array 计算结果 array();
 */
const mydebj = function mydebj(year_lilv, money, month) {
  money = money * 10000;
  var active = year_lilv * 10 / 12 * 0.001;
  var objArray = new Array();
  var interestM = 0; //月还款额
  var interestTotal = 0; //累计还款总额
  var chbj = money / month; //每月偿还本金（元） month 3年36
  for (var i = 1; i <= month; i++) {
    var t1 = (money - money * (i - 1) / month) * active; //第i月还款利息
    interestM = money / month + t1; //第i月还款额
    objArray[i - 1] = new Array(); //声明二维，每一个一维数组里面的一个元素都是一个数组；
    objArray[i - 1]['qc'] = i; //期次
    objArray[i - 1]['chbx'] = (interestM).toFixed(2); //第i个月，偿还本息（元） 月供
    objArray[i - 1]['chlx'] = (interestM - chbj).toFixed(2); //第i个月，偿还利息（元）
    objArray[i - 1]['chbj'] = (chbj).toFixed(2); //第i个月，偿还本金（元）
    objArray[i - 1]['sybj'] = (money - (chbj * i)).toFixed(2); //第i个月，剩余本金（元）
    if (objArray[i - 1]['sybj'] <= 1) { //最后一个月出现小于1元的值
      objArray[i - 1]['sybj'] = 0.00; //第i个月，剩余本金（元）
    }
    interestTotal = interestTotal + interestM;
  }

  let ljhkze = (interestTotal * 100) * 0.01;
  return {
    yg: parseFloat(objArray[0]['chbx']).toFixed(0), //月供 最高月供
    ljhkze: parseFloat(ljhkze).toFixed(0), //累计还款总额
    lxze: parseFloat(ljhkze - money).toFixed(0), //利息总额
    list: objArray, //详情数组消息
  };
}


/**
 * ----处理两位小数----
 * @param string val 字符串 
 */
const floatInput = function floatInput(val) {
  let checkPlan = "" + val;
  checkPlan = checkPlan
    .replace(/[^\d.]/g, "") // 清除“数字”和“.”以外的字符
    .replace(/\.{2,}/g, ".") // 只保留第一个. 清除多余的
    .replace(/^\./g, "") // 保证第一个为数字而不是.
    .replace(".", "$#$")
    .replace(/\./g, "")
    .replace("$#$", ".");
  if ((".") < 0 && checkPlan !== "") {
    // 以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
    checkPlan = parseFloat(checkPlan) + "";
  } else if ((".") >= 0) {
    // 只能输入两个小数
    checkPlan = (/^()*(\d+)\.(\d\d).*$/, "$1$2.$3");
  }
  return checkPlan;
}


 = {
  monthBack,
  mydebx,
  mydebj,
  floatInput,
};

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91
• 92
• 93
• 94
• 95
• 96
• 97
• 98
• 99
• 100
• 101
• 102
• 103
• 104
• 105
• 106
• 107
• 108
• 109
• 110
• 111
• 112
• 113
• 114
• 115
• 116
• 117
• 118
• 119
• 120
• 121
• 122
• 123
• 124
• 125
• 126
• 127
• 128
• 129
• 130
• 131
• 132
• 133
• 134
• 135
• 136
• 137
• 138
• 139
• 140
• 141
• 142
• 143
• 144
• 145
• 146
• 147
• 148
• 149