70b1dbf6 by Zelig

计算

1 parent 97b56019
......@@ -19,29 +19,23 @@
<div class="form-group col-sm-3 col-md-2">
<label>产品名称</label>
<span class="form-control select-box">
<select id="product" class="select" size="1" name="productId">
<?php foreach ($this->session->products as $k => $v): ?>
<option data-repaymentMode="<?= $v->repaymentMode ?>"
data-loanDeadline="<?= $v->loanDeadline ?>"
value="<?= $v->id ?>"><?= $v->productName ?></option>
<?php endforeach; ?>
</select>
</span>
<select id="product" class="select" size="1" v-model="product">
<option v-for="(v, index) in products" :value="v">{{v.productName}}</option>
</select>
</span>
</div>
<div class="form-group col-sm-3 col-md-2">
<label>借款金额</label>
<input name="borrowAmount" type="text" class="form-control input-text" value="">
<input name="borrowAmount" type="text" class="form-control input-text" v-model="borrowAmount">
<span class="glyphicon form-control-feedback"></span>
</div>
<div class="form-group col-sm-3 col-md-2">
<label>借款期数</label>
<span class="form-control select-box">
<select class="select" size="1" id="loanDeadline">
<?php for ($i = 1; $i <= $this->session->products[0]->loanDeadline; $i++): ?>
<option value="<?= $i ?>"><?= $i ?></option>
<?php endfor; ?>
</select>
</span>
<select class="select" size="1" v-model="loanDeadline">
<option v-for="v in loanDeadlines" :value="v * 6">{{v * 6}} 期</option>
</select>
</span>
</div>
<div class="form-group col-sm-3 col-md-2">
<label>还款方式</label>
......@@ -56,24 +50,19 @@
<div class="panel panel-default mb-20">
<div class="panel-header">计算结果</div>
<div class="panel-body months">
<div class="row cl">
<div class="form-group col-sm-3 col-md-2">
<label>每月应还</label>
<input type="text" id="totalAmount" class="form-control input-text" value="" disabled>
<span class="glyphicon form-control-feedback"></span>
</div>
<!-- <div class="form-group col-sm-3 col-md-2">-->
<!-- <label>总共应还</label>-->
<!-- <input type="text" id="totalRepay" class="form-control input-text" value="" disabled>-->
<!-- <span class="glyphicon form-control-feedback">元</span>-->
<!-- </div>-->
<div class="row cl">
<div class="form-group col-sm-3 col-md-2">
<label>每月应还</label>
<input type="text" id="totalAmount" class="form-control input-text" :value="totalAmount" disabled>
<span class="glyphicon form-control-feedback"></span>
</div>
</div>
</div>
<div class="panel-body">
<div class="row cl">
<div class="form-group col-sm-3 col-md-2">
<label>总共应还</label>
<input type="text" id="totalRepay" class="form-control input-text" value="" disabled>
<input type="text" id="totalRepay" class="form-control input-text" :value="totalRepay" disabled>
<span class="glyphicon form-control-feedback"></span>
</div>
</div>
......@@ -83,7 +72,7 @@
<div class="row cl pb-20 col-sm-12">
<div class="col-sm-offset-4 col-sm-2">
<button class="btn btn-primary btn-block">计算</button>
<button class="btn btn-primary btn-block" type="button" @click="cal()">计算</button>
</div>
<div class="col-sm-2">
<input class="btn btn-warning btn-block" value="重置" type="reset">
......@@ -94,82 +83,130 @@
<?php $this->load->view('common/footer'); ?>
<script>
$('#product').change(function () {
var data = $(this).find(':selected').data();
$('#repaymentMode').val(data.repaymentmode);
$('#loanDeadline').empty();
var str = '';
for (var i = 1; i <= parseInt(data.loandeadline); i++) {
str += '<option value="' + i + '">' + i + '</option>';
}
$('#loanDeadline').append(str);
})
$('#form').submit(function (e) {
e.stopPropagation();
e.preventDefault();
var borrowAmount = $('[name=borrowAmount]').val();
var productId = $('[name=productId]').val();
var loanDeadline = $('#loanDeadline').val();
str = 'borrowAmount=' + borrowAmount + '&productId=' + productId + '&loanDeadline=' + loanDeadline;
$.ajax({
type: 'get',
url: apiBaseUrl + 'application/tool/interest?' + str,
cache: false,
dataType: 'json',
contentType: "application/json; charset=UTF-8",
success: function (data) {
if (data.code != 0) {
var msg = data.msg ? data.msg : '操作失败';
layer.alert(msg);
} else {
$('#totalRepay').val(data.data.totalRepay);
if(data.data.repayPlans.length > 1){
var len = data.data.repayPlans.length-1;
if(data.data.repayPlans[0].totalAmount != data.data.repayPlans[len].totalAmount){
$('.months').html('');
var str = '';
for(var i=0;i<data.data.repayPlans.length;i++){
str += '<div class="row cl">'+
'<div class="form-group col-sm-3 col-md-2">'+
'<label>'+(i+1)+'月应还</label>'+
'<input type="text" id="totalAmount" class="form-control input-text" value="'+data.data.repayPlans[i].totalAmount+'" disabled>'+
'<span class="glyphicon form-control-feedback">元</span>'+
'</div>'+
'</div>';
}
$('.months').html(str);
}else{
str1 = '<div class="row cl">'+
'<div class="form-group col-sm-3 col-md-2">'+
'<label>每月应还</label>'+
'<input type="text" id="totalAmount" class="form-control input-text" value="'+data.data.repayPlans[0].totalAmount+'" disabled>'+
'<span class="glyphicon form-control-feedback">元</span>'+
'</div>'+
'</div>';
$('.months').html(str1);
}
}else{
str1 = '<div class="row cl">'+
'<div class="form-group col-sm-3 col-md-2">'+
'<label>每月应还</label>'+
'<input type="text" id="totalAmount" class="form-control input-text" value="'+data.data.repayPlans[0].totalAmount+'" disabled>'+
'<span class="glyphicon form-control-feedback">元</span>'+
'</div>'+
'</div>';
$('.months').html(str1);
// $('#totalAmount').val(data.data.repayPlans[0].totalAmount);
}
var vm = new Vue({
el: '#form',
data: {
products: [],
product: {},
borrowAmount: '',
loanDeadline: 6,
totalRepay: 0,
totalAmount: 0,
},
mounted () {
let _this = this;
instance.get('/config/products').then( ( {data} ) => {
this.products = data.data
});
},
methods: {
cal () {
let str = 'borrowAmount=' + this.borrowAmount + '&productId=' + this.product.id + '&loanDeadline=' + this.loanDeadline;
instance.get('application/tool/interest?' + str).then( ( {data} ) => {
console.log(data);
this.totalRepay = data.data.totalRepay;
this.totalAmount = data.data.repayPlans[0].totalAmount;
});
}
},
computed: {
loanDeadlines () {
return this.product.loanDeadline / 6 ? this.product.loanDeadline / 6 : 0;
}
},
watch: {
borrowAmount () {
if(this.borrowAmount > this.product.loanLimit) {
layer.alert('不能超过最大值' + this.product.loanLimit);
this.borrowAmount = this.product.loanLimit;
}
},
error: function () {
layer.alert("操作失败")
product () {
if(this.borrowAmount > this.product.loanLimit) {
layer.alert('不能超过最大值' + this.product.loanLimit);
this.borrowAmount = this.product.loanLimit;
}
}
})
})
}
});
// $('#product').change(function () {
// var data = $(this).find(':selected').data();
// $('#repaymentMode').val(data.repaymentmode);
// $('#loanDeadline').empty();
// var str = '';
// for (var i = 1; i <= parseInt(data.loandeadline); i++) {
// str += '<option value="' + i + '">' + i + '</option>';
// }
// $('#loanDeadline').append(str);
// })
//
// $('#form').submit(function (e) {
// e.stopPropagation();
// e.preventDefault();
// var borrowAmount = $('[name=borrowAmount]').val();
// var productId = $('[name=productId]').val();
// var loanDeadline = $('#loanDeadline').val();
// str = 'borrowAmount=' + borrowAmount + '&productId=' + productId + '&loanDeadline=' + loanDeadline;
// $.ajax({
// type: 'get',
// url: apiBaseUrl + 'application/tool/interest?' + str,
// cache: false,
// dataType: 'json',
// contentType: "application/json; charset=UTF-8",
// success: function (data) {
// if (data.code != 0) {
// var msg = data.msg ? data.msg : '操作失败';
// layer.alert(msg);
// } else {
// $('#totalRepay').val(data.data.totalRepay);
// if(data.data.repayPlans.length > 1){
// var len = data.data.repayPlans.length-1;
// if(data.data.repayPlans[0].totalAmount != data.data.repayPlans[len].totalAmount){
// $('.months').html('');
// var str = '';
// for(var i=0;i<data.data.repayPlans.length;i++){
// str += '<div class="row cl">'+
// '<div class="form-group col-sm-3 col-md-2">'+
// '<label>'+(i+1)+'月应还</label>'+
// '<input type="text" id="totalAmount" class="form-control input-text" value="'+data.data.repayPlans[i].totalAmount+'" disabled>'+
// '<span class="glyphicon form-control-feedback">元</span>'+
// '</div>'+
// '</div>';
// }
// $('.months').html(str);
// }else{
// str1 = '<div class="row cl">'+
// '<div class="form-group col-sm-3 col-md-2">'+
// '<label>每月应还</label>'+
// '<input type="text" id="totalAmount" class="form-control input-text" value="'+data.data.repayPlans[0].totalAmount+'" disabled>'+
// '<span class="glyphicon form-control-feedback">元</span>'+
// '</div>'+
// '</div>';
// $('.months').html(str1);
// }
//
//
// }else{
// str1 = '<div class="row cl">'+
// '<div class="form-group col-sm-3 col-md-2">'+
// '<label>每月应还</label>'+
// '<input type="text" id="totalAmount" class="form-control input-text" value="'+data.data.repayPlans[0].totalAmount+'" disabled>'+
// '<span class="glyphicon form-control-feedback">元</span>'+
// '</div>'+
// '</div>';
// $('.months').html(str1);
// // $('#totalAmount').val(data.data.repayPlans[0].totalAmount);
// }
//
// }
// },
// error: function () {
// layer.alert("操作失败")
// }
// })
// })
</script>
</body>
<html>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!