妥妥银服-利率由选择改成输入

htmldev/loan/src/views/loan/calculator/index.vue

@@ -30,7 +30,7 @@
                    :border="false"
                    placeholder="请输入您的商贷金额"
                    class="ttyf-van-cell ttyf-no-arrow"
-                   @input="sdjine = sdjine.replace(/^\D*(\d*(?:\.\d{0,5})?).*$/g, '$1')">
+                   @input="sdjine = sdjine.replace(/^\D*(\d*(?:\.\d{0,5})?).*$/g, '$1').replace(/^0\d*/, '0').replace(/^\./, '0.')">
           <template #label>
             <p>
             <span v-for="(str, index) in '商贷金额(万)'"
@@ -48,7 +48,7 @@
                    :border="false"
                    placeholder="请输入金额"
                    class="ttyf-van-cell ttyf-no-arrow"
-                   @input="gjjjine=gjjjine.replace(/^\D*(\d*(?:\.\d{0,5})?).*$/g, '$1')">
+                   @input="gjjjine=gjjjine.replace(/^\D*(\d*(?:\.\d{0,5})?).*$/g, '$1').replace(/^0\d*/, '0').replace(/^\./, '0.')">
           <template #label>
             <p>
             <span v-for="(str, index) in '公积金贷款金额(万)'"
@@ -77,15 +77,12 @@
       <!--商业贷款：利率-->
       <template>
         <van-field :class="loanType.value === 1 || loanType.value === 3 ? '' : 'hide'"
-                   readonly
-                   clickable
                    name="sdlilv"
-                   :value="sdlilv"
+                   v-model="sdlilv"
                    :border="false"
-                   :right-icon="iconOfarrow"
-                   placeholder="请选择利率"
-                   class="ttyf-van-cell"
-                   @click="showPicker4 = true">
+                   placeholder="请输入利率"
+                   class="ttyf-van-cell ttyf-no-arrow"
+                   @input="sdlilv=sdlilv.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1').replace(/^0\d*/, '0').replace(/^\./, '0.')">
           <template #label>
             <p>
               <span v-for="(str, index) in '商贷利率(%)'"
@@ -97,15 +94,12 @@
       <!--公积金：利率-->
       <template>
         <van-field :class="loanType.value === 2 || loanType.value === 3 ? '' : 'hide'"
-                   readonly
-                   clickable
                    name="gjjlilv"
-                   :value="gjjlilv"
+                   v-model="gjjlilv"
                    :border="false"
-                   :right-icon="iconOfarrow"
-                   placeholder="请选择利率"
-                   class="ttyf-van-cell"
-                   @click="showPicker2 = true">
+                   placeholder="请输入利率"
+                   class="ttyf-van-cell ttyf-no-arrow"
+                   @input="gjjlilv=gjjlilv.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1').replace(/^0\d*/, '0').replace(/^\./, '0.')">
           <template #label>
             <p>
               <span v-for="(str, index) in '公积金贷款利率(%)'"
@@ -202,32 +196,6 @@
         ref="myPicker1"
       />
     </van-popup>
-    <!--公积金利率选择-->
-    <van-popup v-model="showPicker2"
-               :close-on-click-overlay="false"
-               @click-overlay="onCancel2"
-               position="bottom">
-      <van-picker show-toolbar
-                  :columns="columns2"
-                  :default-index="defaultIndex2"
-                  @confirm="onConfirm2"
-                  @cancel="onCancel2"
-                  ref="myPicker2"
-      />
-    </van-popup>
-    <!--商贷利率选择-->
-    <van-popup v-model="showPicker4"
-               :close-on-click-overlay="false"
-               @click-overlay="onCancel4"
-               position="bottom">
-      <van-picker show-toolbar
-                  :columns="columns4"
-                  :default-index="defaultIndex4"
-                  @confirm="onConfirm4"
-                  @cancel="onCancel4"
-                  ref="myPicker4"
-      />
-    </van-popup>
     <!--贷款类型选择-->
     <van-popup v-model="showPicker5"
                :close-on-click-overlay="false"
@@ -269,10 +237,10 @@ export default {
     return {
       loanTypeIndx: 0,
       gjjjine: '', // 公积金贷款金额
+      gjjlilv: '', // 公积金贷款利率
       gjjnianxianIndex: 19,
-      gjjlilvIndex: 0,
       sdjine: '', // 商贷金额
-      sdlilvIndex: 0,
+      sdlilv: '', // 商贷利率
       hkfangshiIndex: 0,
       meiyuehuanchuan: '', // 每月还款
       zonglixi: '', // 总共支付利息
@@ -282,10 +250,6 @@ export default {
       showPicker1: false,
       columns1: loanConfig.loanYear,
       defaultIndex1: 19,
-      showPicker2: false,
-      defaultIndex2: 0,
-      showPicker4: false,
-      defaultIndex4: 0,
       showPicker5: false,
       columns5: loanConfig.payType,
       defaultIndex5: 0
@@ -295,14 +259,6 @@ export default {
     iconOfarrow () {
       return require('./image/btn_next@2x.png')
     },
-    // 公积金利率列表数据
-    columns2 () {
-      return this.lilvCal(this.gjjnianxian.value, loanConfig.gjjLilv, loanConfig.gjjSelect)
-    },
-    // 商贷利率列表数据
-    columns4 () {
-      return this.lilvCal(this.gjjnianxian.value, loanConfig.shangdaiLilv, loanConfig.shangdaiSelect)
-    },
     recommendedProduct: {
       get () {
         return this.$store.state.loan.recommendedProduct
@@ -323,18 +279,6 @@ export default {
         return loanConfig.loanYear[this.gjjnianxianIndex]
       }
     },
-    // 公积金贷款利率
-    gjjlilv: {
-      get () {
-        return (this.columns2[this.gjjlilvIndex].lilv * 100).toFixed(2)
-      }
-    },
-    // 商贷利率
-    sdlilv: {
-      get () {
-        return (this.columns4[this.sdlilvIndex].lilv * 100).toFixed(2)
-      }
-    },
     // 还款方式
     hkfangshi: {
       get () {
@@ -346,10 +290,10 @@ export default {
     if (!this.$route.meta.isUseCache) {
       this.loanTypeIndx = 0
       this.gjjjine = ''
+      this.gjjlilv = ''
       this.gjjnianxianIndex = 19
-      this.gjjlilvIndex = 0
       this.sdjine = ''
-      this.sdlilvIndex = 0
+      this.sdlilv = ''
       this.hkfangshiIndex = 0
       this.meiyuehuanchuan = ''
       this.zonglixi = ''
@@ -359,10 +303,6 @@ export default {
       this.showPicker1 = false
       this.columns1 = loanConfig.loanYear
       this.defaultIndex1 = 19
-      this.showPicker2 = false
-      this.defaultIndex2 = 0
-      this.showPicker4 = false
-      this.defaultIndex4 = 0
       this.showPicker5 = false
       this.columns5 = loanConfig.payType
       this.defaultIndex5 = 0
@@ -371,20 +311,6 @@ export default {
     this.$route.meta.isUseCache = false
   },
   methods: {
-    lilvCal (year, lilv, selectcontent) {
-      let getLilv = ''
-      lilv.forEach(item => {
-        if (year >= item.year) {
-          getLilv = item.lilv
-        }
-      })
-      return JSON.parse(JSON.stringify(selectcontent)).map(item => {
-        return {
-          lilv: (item.lilv * getLilv).toFixed(4),
-          text: item.text
-        }
-      })
-    },
     // 贷款类型
     onConfirm0 (value, index) {
       this.loanTypeIndx = index
@@ -403,24 +329,6 @@ export default {
       this.$refs.myPicker1.setIndexes([this.gjjnianxianIndex])
       this.showPicker1 = false
     },
-    // 公积金贷款利率
-    onConfirm2 (value, index) {
-      this.gjjlilvIndex = index
-      this.showPicker2 = false
-    },
-    onCancel2 () {
-      this.$refs.myPicker2.setIndexes([this.gjjlilvIndex])
-      this.showPicker2 = false
-    },
-    // 商贷利率
-    onConfirm4 (value, index) {
-      this.sdlilvIndex = index
-      this.showPicker4 = false
-    },
-    onCancel4 () {
-      this.$refs.myPicker4.setIndexes([this.sdlilvIndex])
-      this.showPicker4 = false
-    },
     // 还款方式
     onConfirm5 (value, index) {
       this.hkfangshiIndex = index
@@ -449,8 +357,8 @@ export default {
     },
     async handleComputed () {
       await this.$nextTick()
-      const sdlilv = this.columns4[this.sdlilvIndex]
-      const gjjlilv = this.columns2[this.gjjlilvIndex]
+      const sdlilv = this.sdlilv / 100
+      const gjjlilv = this.gjjlilv / 100
       let result = {}
       let yuegong = ''
       let totalLixi = ''
@@ -459,17 +367,17 @@ export default {
       switch (this.loanType.value) {
         case 1:
           if (this.sdjine) {
-            result = calcute.singleDk(payType, this.sdjine, this.gjjnianxian.value, sdlilv.lilv)
+            result = calcute.singleDk(payType, this.sdjine, this.gjjnianxian.value, sdlilv)
           }
           break
         case 2:
           if (this.gjjjine) {
-            result = calcute.singleDk(payType, this.gjjjine, this.gjjnianxian.value, gjjlilv.lilv)
+            result = calcute.singleDk(payType, this.gjjjine, this.gjjnianxian.value, gjjlilv)
           }
           break
         case 3:
           if (this.sdjine && this.gjjjine) {
-            result = calcute.zuhe(payType, this.sdjine, this.gjjjine, this.gjjnianxian.value, this.gjjnianxian.value, sdlilv.lilv, gjjlilv.lilv)
+            result = calcute.zuhe(payType, this.sdjine, this.gjjjine, this.gjjnianxian.value, this.gjjnianxian.value, sdlilv, gjjlilv)
           }
           break
       }