Default Changelist

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

@@ -142,6 +142,11 @@
           </p>
         </template>
       </van-field>
+      <van-button class="ttyf-get-result"
+                  type="info"
+                  @click="handleComputed">开始计算
+      </van-button>
+      <p class="ttyf-tip">计算结果：</p>
       <van-field
         readonly
         clickable
@@ -269,7 +274,7 @@
 </template>
 
 <script>
-import { Form, Field, Popup, Picker } from 'vant'
+import { Form, Field, Popup, Picker, Button } from 'vant'
 import { loanConfig } from './config'
 import { calcute } from './config/calculate'
 
@@ -279,7 +284,8 @@ export default {
     'van-form': Form,
     'van-field': Field,
     'van-popup': Popup,
-    'van-picker': Picker
+    'van-picker': Picker,
+    'van-button': Button
   },
   props: {
     role: {
@@ -361,8 +367,6 @@ export default {
     onConfirm0 (value, index) {
       this.loanType = value
       this.showPicker0 = false
-
-      this.handleComputed()
     },
     onCancel0 () {
       const index = this.columns0.findIndex(item => item.value === this.loanType.value)
@@ -375,8 +379,6 @@ export default {
     onConfirm1 (value, index) {
       this.gjjnianxian = value
       this.showPicker1 = false
-
-      this.handleComputed()
     },
     onCancel1 () {
       const index = this.columns1.findIndex(item => item.value === this.gjjnianxian.value)
@@ -389,8 +391,6 @@ export default {
     onConfirm2 (value, index) {
       this.gjjlilv = value
       this.showPicker2 = false
-
-      this.handleComputed()
     },
     onCancel2 () {
       const index = this.columns2.findIndex(item => item.lilv === this.gjjlilv.lilv)
@@ -403,8 +403,6 @@ export default {
     onConfirm3 (value) {
       this.sdnianxian = value
       this.showPicker3 = false
-
-      this.handleComputed()
     },
     onCancel3 () {
       const index = this.columns3.findIndex(item => item.value === this.sdnianxian.value)
@@ -417,9 +415,6 @@ export default {
     onConfirm4 (value, index) {
       this.sdlilv = value
       this.showPicker4 = false
-      calcute.singleDk(1, 20, this.sdnianxian.value, this.sdlilv.lilv)
-
-      this.handleComputed()
     },
     onCancel4 () {
       const index = this.columns4.findIndex(item => item.lilv === this.sdlilv.lilv)
@@ -432,8 +427,6 @@ export default {
     onConfirm5 (value, index) {
       this.hkfangshi = value
       this.showPicker5 = false
-
-      this.handleComputed()
     },
     onCancel5 () {
       const index = this.columns5.findIndex(item => item.value === this.hkfangshi.value)
@@ -613,4 +606,31 @@ form {
     line-height: 17px;
   }
 }
+
+.ttyf-get-result {
+  width: 327px;
+  height: 45px;
+  border: none;
+  margin: 20px 0;
+  background: linear-gradient(90deg, #E5C7A5 0%, #CFAA7F 100%);
+  box-shadow: 0 14px 9px -10px rgba(219, 208, 194, 1);
+  border-radius: 4px;
+
+  .van-button__text {
+    font-size: 14px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #FFFFFF;
+  }
+}
+
+.ttyf-tip {
+  width: 327px;
+  margin-bottom: 10px;
+  font-size: 16px;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #333333;
+  line-height: 22px;
+}
 </style>