项目日志:计算最高贷款金额已解决

src/components/BillForm/BillForm.vue

@@ -1,17 +1,18 @@
 <template>
   <div>
     <div
-    v-for="(item, index) in contractDrafts"
-    :key="index"
-    v-if="item.draftStatus != 1"
+      v-for="(item, index) in contractDrafts"
+      :key="index"
+      v-if="item.draftStatus != 1"
     >
-
       <el-row class="form-container-items">
         <!-- 汇票名称 -->
         <el-col :span="colSpan">
-          <el-form-item label="汇票名称"
-          :prop="'contractDrafts.' + index + '.name'"
-          :rules="rules.name">
+          <el-form-item
+            label="汇票名称"
+            :prop="'contractDrafts.' + index + '.name'"
+            :rules="rules.name"
+          >
             <el-input
               v-model="item.name"
               class="ipwidth"
@@ -22,9 +23,11 @@
         </el-col>
         <!-- 汇票号码 -->
         <el-col :span="colSpan">
-          <el-form-item label="汇票号码"
-          :prop="'contractDrafts.' + index + '.draftNo'"
-          :rules="rules.draftNo">
+          <el-form-item
+            label="汇票号码"
+            :prop="'contractDrafts.' + index + '.draftNo'"
+            :rules="rules.draftNo"
+          >
             <el-input
               v-model="item.draftNo"
               class="ipwidth"
@@ -35,21 +38,26 @@
         </el-col>
         <!-- 出票人 -->
         <el-col :span="colSpan">
-
-          <el-form-item label="出票人"
-          :prop="'contractDrafts.' + index + '.drawersId'"
-          :rules="rules.drawersId">
-
+          <el-form-item
+            label="出票人"
+            :prop="'contractDrafts.' + index + '.drawersId'"
+            :rules="rules.drawersId"
+          >
             <DrawerSelect v-model="item.drawersId" />
-           <i class="el-icon-circle-plus-outline" style="font-size:20px;cursor: pointer;"
-            @click="addDrawer" />
+            <i
+              class="el-icon-circle-plus-outline"
+              style="font-size: 20px; cursor: pointer"
+              @click="addDrawer"
+            />
           </el-form-item>
         </el-col>
         <!-- 预计贴现日 -->
         <el-col :span="colSpan">
-          <el-form-item label="预计贴现日"
-          :prop="'contractDrafts.' + index + '.expectDiscountDate'"
-          :rules="rules.expectDiscountDate">
+          <el-form-item
+            label="预计贴现日"
+            :prop="'contractDrafts.' + index + '.expectDiscountDate'"
+            :rules="rules.expectDiscountDate"
+          >
             <el-date-picker
               v-model="item.expectDiscountDate"
               type="date"
@@ -62,9 +70,11 @@
         </el-col>
         <!-- 金额 -->
         <el-col :span="colSpan">
-          <el-form-item label="金额"
-          :prop="'contractDrafts.' + index + '.money'"
-          :rules="rules.money">
+          <el-form-item
+            label="金额"
+            :prop="'contractDrafts.' + index + '.money'"
+            :rules="rules.money"
+          >
             <el-input
               v-model="item.money"
               class="ipwidth"
@@ -76,20 +86,24 @@
         </el-col>
         <!-- 承兑人 -->
         <el-col :span="colSpan">
-          <el-form-item label="承兑人"
-          :prop="'contractDrafts.' + index + '.acceptorName'"
-          :rules="rules.acceptorName">
+          <el-form-item
+            label="承兑人"
+            :prop="'contractDrafts.' + index + '.acceptorName'"
+            :rules="rules.acceptorName"
+          >
             <AcceptorSelect
               v-model="item.acceptorName"
-              @change="(...args)=> changeAcceptorName(...args, index)"
+              @change="(...args) => changeAcceptorName(...args, index)"
             />
           </el-form-item>
         </el-col>
         <!-- 承兑日期 -->
         <el-col :span="colSpan">
-          <el-form-item label="承兑日期"
-          :prop="'contractDrafts.' + index + '.acceptDate'"
-          :rules="rules.acceptDate">
+          <el-form-item
+            label="承兑日期"
+            :prop="'contractDrafts.' + index + '.acceptDate'"
+            :rules="rules.acceptDate"
+          >
             <el-date-picker
               v-model="item.acceptDate"
               type="date"
@@ -103,9 +117,7 @@
         </el-col>
         <!-- 服务费 -->
         <el-col :span="colSpan">
-          <el-form-item label="服务费"
-          prop="serviceMoney"
-          >
+          <el-form-item label="服务费" prop="serviceMoney">
             <el-input
               v-model="item.serviceMoney"
               class="ipwidth"
@@ -118,9 +130,11 @@
 
         <!-- 出票日期 -->
         <el-col :span="colSpan">
-          <el-form-item label="出票日期"
-          :prop="'contractDrafts.' + index + '.issueDate'"
-          :rules="rules.issueDate">
+          <el-form-item
+            label="出票日期"
+            :prop="'contractDrafts.' + index + '.issueDate'"
+            :rules="rules.issueDate"
+          >
             <el-date-picker
               v-model="item.issueDate"
               type="date"
@@ -131,9 +145,7 @@
         </el-col>
         <!-- 最高贷款额度 -->
         <el-col :span="colSpan">
-          <el-form-item label="最高贷款额度"
-          prop="loanLimit"
-          >
+          <el-form-item label="最高贷款额度" prop="loanLimit">
             <el-input
               v-model="item.loanLimit"
               class="ipwidth"
@@ -145,9 +157,7 @@
         </el-col>
         <!-- 利率 -->
         <el-col :span="colSpan">
-          <el-form-item label="利率"
-          prop="interestRate"
-          >
+          <el-form-item label="利率" prop="interestRate">
             <el-input
               v-model="item.interestRate"
               clearable
@@ -161,9 +171,11 @@
         </el-col>
         <!-- 到期日期 -->
         <el-col :span="colSpan">
-          <el-form-item label="到期日期"
-          :prop="'contractDrafts.' + index + '.expireDate'"
-          :rules="rules.expireDate">
+          <el-form-item
+            label="到期日期"
+            :prop="'contractDrafts.' + index + '.expireDate'"
+            :rules="rules.expireDate"
+          >
             <el-date-picker
               v-model="item.expireDate"
               type="date"
@@ -174,9 +186,7 @@
         </el-col>
         <!-- 利息 -->
         <el-col :span="colSpan">
-          <el-form-item label="利息"
-          prop="interest"
-          >
+          <el-form-item label="利息" prop="interest">
             <el-input
               v-model="item.interest"
               class="ipwidth"
@@ -188,9 +198,7 @@
         </el-col>
         <!-- 服务费率 -->
         <el-col :span="colSpan">
-          <el-form-item label="服务费率"
-          prop="serviceRate"
-          >
+          <el-form-item label="服务费率" prop="serviceRate">
             <el-input
               v-model="item.serviceRate"
               class="ipwidth"
@@ -198,231 +206,236 @@
               clearable
               disabled
             >
-             <template slot="append">%</template>
-           </el-input>
+              <template slot="append">%</template>
+            </el-input>
           </el-form-item>
         </el-col>
         <!-- 附件 -->
         <el-col :span="colSpan">
-          <el-form-item label="附件"
-           :rules="rules.picUrls"
-           :prop="'contractDrafts.' + index + '.picUrls'">
-					 <span style="color: #d05c39">*支持上传pdf、jpg/jpeg、png格式,大小30M以下</span>
+          <el-form-item
+            label="附件"
+            :rules="rules.picUrls"
+            :prop="'contractDrafts.' + index + '.picUrls'"
+          >
+            <span style="color: #d05c39"
+              >*支持上传pdf、jpg/jpeg、png格式,大小30M以下</span
+            >
             <FileUpload
-            v-model="item.picUrls"
-            accept=".jpg, .jpeg, .png, .pdf"
+              v-model="item.picUrls"
+              accept=".jpg, .jpeg, .png, .pdf"
             />
           </el-form-item>
         </el-col>
 
         <!-- 删除汇票 -->
-        <el-col :span="24" style="text-align:right">
-          <el-button
-            v-if="showDel"
-            type="primary"
-            @click="onDelete(index)"
-          >删除汇票</el-button>
+        <el-col :span="24" style="text-align: right">
+          <el-button v-if="showDel" type="primary" @click="onDelete(index)"
+            >删除汇票</el-button
+          >
         </el-col>
-
       </el-row>
-
-  </div>
-
+    </div>
   </div>
 </template>
 
 <script>
-import { maxLoanAmount, serviceCharge, interest } from '@/utils/calc'
-import DrawerSelect from '@/components/DrawerSelect/DrawerSelect.vue'
-import AcceptorSelect from '@/components/AcceptorSelect/AcceptorSelect.vue'
+import { maxLoanAmount, serviceCharge, interest } from "@/utils/calc";
+import DrawerSelect from "@/components/DrawerSelect/DrawerSelect.vue";
+import AcceptorSelect from "@/components/AcceptorSelect/AcceptorSelect.vue";
 
 export default {
-  name: 'BillForm',
+  name: "BillForm",
   props: {
     value: {
       type: Array,
       default: () => {
-        return []
+        return [];
       },
     },
     showDel: {
       type: Boolean,
-      default: true
-    }
+      default: true,
+    },
   },
   components: {
     DrawerSelect,
-    AcceptorSelect
+    AcceptorSelect,
   },
   data() {
     return {
       colSpan: 8,
       contractDrafts: [],
       rules: {
-        name: [
-          { required: true, message: '请输入', trigger: 'blur' }
-        ],
-        draftNo: [
-          { required: true, message: '请输入', trigger: 'blur' }
-        ],
-        drawersId: [
-          { required: true, message: '请输入', trigger: 'change' }
-        ],
+        name: [{ required: true, message: "请输入", trigger: "blur" }],
+        draftNo: [{ required: true, message: "请输入", trigger: "blur" }],
+        drawersId: [{ required: true, message: "请输入", trigger: "change" }],
         expectDiscountDate: [
-          { required: true, message: '请选择', trigger: 'blur' }
-        ],
-        money: [
-          { required: true, message: '请输入', trigger: 'blur' }
+          { required: true, message: "请选择", trigger: "blur" },
         ],
+        money: [{ required: true, message: "请输入", trigger: "blur" }],
         acceptorName: [
-          { required: true, message: '请选择', trigger: 'change' }
-        ],
-        issueDate: [
-          { required: true, message: '请选择', trigger: 'blur' }
-        ],
-        acceptDate: [
-          { required: true, message: '请选择', trigger: 'blur' }
-        ],
-        expireDate: [
-          { required: true, message: '请选择', trigger: 'blur' }
+          { required: true, message: "请选择", trigger: "change" },
         ],
+        issueDate: [{ required: true, message: "请选择", trigger: "blur" }],
+        acceptDate: [{ required: true, message: "请选择", trigger: "blur" }],
+        expireDate: [{ required: true, message: "请选择", trigger: "blur" }],
         picUrls: [
           // validator: this.validatePicUrls
-          { required: true, message: '请选择', trigger: ['change', 'input'] }
-        ]
-      }
-    }
+          { required: true, message: "请选择", trigger: ["change", "input"] },
+        ],
+      },
+    };
   },
-  watch:{
+  watch: {
     value(val, old) {
       //console.log('BillForm=', val)
-      if(val){
-        this.contractDrafts = val
+      if (val) {
+        this.contractDrafts = val;
       }
-    }
+    },
   },
   methods: {
     addDrawer() {
       // this.$router.go(-1)
-	  this.$router.push({path:'/form/addTicketdrawer'})
+      this.$router.push({ path: "/form/addTicketdrawer" });
     },
     onDelete(index) {
-      const contractDraftsLength = this.contractDrafts.length
+      const contractDraftsLength = this.contractDrafts.length;
       if (contractDraftsLength > 1) {
-        this.contractDrafts.splice(index, 1)
-        this.emitInput()
+        this.contractDrafts.splice(index, 1);
+        this.emitInput();
       } else {
-        this.$message.error('默认汇票禁止删除')
+        this.$message.error("默认汇票禁止删除");
       }
     },
     changeAcceptorName(value, exist, index) {
       if (exist) {
-        const { acceptorId, interest, serviceRate,acceptorName } = exist
-        this.contractDrafts[index].acceptorName=acceptorName
-        this.contractDrafts[index].acceptorId = acceptorId
-        this.contractDrafts[index].interestRate = interest
-        this.contractDrafts[index].serviceRate = serviceRate
-        this.inputMoney(index)
+        const { acceptorId, interest, serviceRate, acceptorName } = exist;
+        this.contractDrafts[index].acceptorName = acceptorName;
+        this.contractDrafts[index].acceptorId = acceptorId;
+        this.contractDrafts[index].interestRate = interest;
+        this.contractDrafts[index].serviceRate = serviceRate;
+        this.inputMoney(index);
       }
     },
     // 计算金额
     inputMoney(index) {
       //console.log('计算金额')
-      this.getloanLimt(index)
-      this.getSerMoney(index)
-      this.getInterMoney(index)
-      this.emitInput()
+      this.getloanLimt(index);
+      this.getSerMoney(index);
+      this.getInterMoney(index);
+      this.emitInput();
     },
     /* 计算最高贷款额度 */
+    // getloanLimt(index) {
+    //   const {
+    //     money,
+    //     serviceRate,
+    //     interestRate,
+    //     expectDiscountDate,
+    //     acceptDate
+    //   } = this.contractDrafts[index]
+    //   console.log(this.contractDrafts[index]);
+    //   this.contractDrafts[index].loanLimit = maxLoanAmount(
+    //     money,
+    //     serviceRate,
+    //     interestRate,
+    //     expectDiscountDate,
+    //     acceptDate
+    //   )
+    // },
+    /* 计算最高贷款额度 */
     getloanLimt(index) {
       const {
         money,
         serviceRate,
         interestRate,
         expectDiscountDate,
-        acceptDate
-      } = this.contractDrafts[index]
+        acceptDate,
+      } = this.contractDrafts[index];
+      console.log(this.contractDrafts[index]);
       this.contractDrafts[index].loanLimit = maxLoanAmount(
         money,
-        serviceRate,
         interestRate,
         expectDiscountDate,
         acceptDate
-      )
+      );
     },
     /* 计算服务费 */
     getSerMoney(index) {
-      const {
-        loanLimit,
-        serviceRate,
-        expectDiscountDate,
-        acceptDate
-      } = this.contractDrafts[index]
+      const { money,loanLimit, serviceRate, expectDiscountDate, acceptDate } =
+        this.contractDrafts[index];
       this.contractDrafts[index].serviceMoney = serviceCharge(
-        loanLimit,
+        money,
         serviceRate,
         expectDiscountDate,
         acceptDate
-      )
+      );
     },
     /* 利息*/
     getInterMoney(index) {
-      const {
-        loanLimit,
-        interestRate,
-        expectDiscountDate,
-        acceptDate
-      } = this.contractDrafts[index]
+      const { loanLimit, interestRate, expectDiscountDate, acceptDate } =
+        this.contractDrafts[index];
       this.contractDrafts[index].interest = interest(
         loanLimit,
         interestRate,
         expectDiscountDate,
         acceptDate
-      )
+      );
     },
     // 预计贴现日
     pickerStart(index) {
-      const that = this
+      const that = this;
       return {
         disabledDate(time) {
-          if (that.contractDrafts[index].issueDate) { // 如果结束时间不为空，则小于结束时间
-            return new Date(that.contractDrafts[index].issueDate).getTime() < time.getTime()
+          if (that.contractDrafts[index].issueDate) {
+            // 如果结束时间不为空，则小于结束时间
+            return (
+              new Date(that.contractDrafts[index].issueDate).getTime() <
+              time.getTime()
+            );
           }
-        }
-      }
+        },
+      };
     },
     // 承兑日期
     pickerEnd(index) {
-      const that = this
+      const that = this;
       return {
         disabledDate(time) {
-          if (that.contractDrafts[index].expectDiscountDate) { // 如果开始时间不为空，则结束时间大于开始时间
-            return new Date(that.contractDrafts[index].expectDiscountDate).getTime() > time.getTime()
+          if (that.contractDrafts[index].expectDiscountDate) {
+            // 如果开始时间不为空，则结束时间大于开始时间
+            return (
+              new Date(
+                that.contractDrafts[index].expectDiscountDate
+              ).getTime() > time.getTime()
+            );
           }
-        }
-      }
+        },
+      };
     },
     validatePicUrls(rule, value, callback) {
       //debugger
-      console.log(Object.keys(value).length, value)
+      console.log(Object.keys(value).length, value);
       if (value && Object.keys(value).length > 0) {
-        callback()
-        return
+        callback();
+        return;
       }
-      callback('请选择')
+      callback("请选择");
     },
     emitInput() {
-      this.$emit('input', this.contractDrafts)
-    }
-  }
-}
+      this.$emit("input", this.contractDrafts);
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
 .form-container {
   margin-top: 15px;
-  padding:10px,20px;
-  .el-input,.el-select {
+  padding: 10px, 20px;
+  .el-input,
+  .el-select {
     width: 80%;
     text-align: left;
   }