添加银行卡

src/views/ecw/customer/edit.vue

@@ -413,6 +413,99 @@
             </el-col>
           </el-row>
         </el-form>
+        <el-card>
+          <div slot="header" class="clearfix">
+            <span>{{$t('银行信息')}}</span>
+            <el-button style="float: right;" size="small" type="primary" @click="addBankData">+</el-button>
+          </div>
+          <el-form ref="bankForm" :model="form">
+            <el-table border :data="form.customerBankAccounts">
+              <el-table-column label="序号" type="index"></el-table-column>
+              <el-table-column>
+                <div slot="header">
+                  账户名称 <span style="color: red;">*</span>
+                </div>
+               <template v-slot="{row,$index}">
+                 <el-form-item :rules="{required:true,message:'请输入账户名称'}" :prop="'customerBankAccounts.'+ $index  +'.baAccountName'">
+                   <el-input size="mini" v-model="row.baAccountName"></el-input>
+                 </el-form-item>
+               </template>
+              </el-table-column>
+              <el-table-column label="币别">
+                <div slot="header">
+                  币别 <span style="color: red;">*</span>
+                </div>
+                <template v-slot="{row,$index}">
+                  <el-form-item :prop="'customerBankAccounts.'+ $index  +'.currency'" :rules="{required:true,message:'请输入币别'}" >
+
+                    <el-select v-model="row.currency">
+                      <el-option v-for="(item) in currecyList" :label="$l(item,'title')" :value="item.id" :key="item.id"></el-option>
+                    </el-select>
+                  </el-form-item>
+                </template>
+              </el-table-column>
+              <el-table-column label="银行名称">
+                <div slot="header">
+                  银行名称 <span style="color: red;">*</span>
+                </div>
+                <template v-slot="{row,$index}">
+                  <el-form-item :prop="'customerBankAccounts.'+ $index +'.baBankName'" :rules="{required:true,message:'银行名称'}">
+                    <el-input v-model="row.baBankName"  size="mini"></el-input>
+                  </el-form-item>
+                </template>
+              </el-table-column>
+              <el-table-column label="银行账户">
+                <div slot="header">
+                  银行账户 <span style="color: red;">*</span>
+                </div>
+                <template v-slot="{row,$index}">
+                  <el-form-item :prop="`customerBankAccounts.${$index}.baAccountNum`" :rules="{required:true,message:'请输入银行账户'}">
+                    <el-input v-model="row.baAccountNum"  size="mini"></el-input>
+                  </el-form-item>
+                </template>
+              </el-table-column>
+              <el-table-column label="银行代码">
+                <template v-slot="{row}">
+                  <el-form-item prop="baSwiftCode">
+                    <el-input v-model="row.baSwiftCode" size="mini"></el-input>
+                  </el-form-item>
+                </template>
+              </el-table-column>
+              <el-table-column label="账户类型">
+                <template v-slot="{row}">
+                  <el-form-item>
+                    <el-select v-model="row.baType">
+                      <el-option value="1" label="公账"></el-option>
+                      <el-option value="2" label="私账" ></el-option>
+                    </el-select>
+                  </el-form-item>
+                </template>
+              </el-table-column>
+              <el-table-column label="状态">
+                <template v-slot="{row}">
+                  <el-form-item>
+                    <el-select v-model="row.status">
+                      <el-option value="0" label="停用"></el-option>
+                      <el-option value="1" label="正常"></el-option>
+                    </el-select>
+                  </el-form-item>
+                </template>
+              </el-table-column>
+              <el-table-column label="银行地址">
+                <template v-slot="{row}">
+                  <el-form-item prop="baBankAdd">
+                    <el-input v-model="row.baBankAdd" size="mini"></el-input>
+                  </el-form-item>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作">
+                <template v-slot="{$index}">
+                  <el-button @click="deleteBankData($index)">删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </el-form>
+        </el-card>
         <div style="text-align: center">
           <el-button type="primary" @click="submitForm">{{$t('确 定')}}</el-button>
           <el-button @click="cancel">{{$t('取 消')}}</el-button>
@@ -450,6 +543,7 @@ import Template from "@/views/cms/template";
 import {validatorMobile} from "@/api/ecw/validate"
 // import {customerDropDownList} from "@/api/ecw/customerCommissionInfo";
 import MemberSelector from '@/components/MemberSelector'
+import {getCurrencyList} from "@/api/ecw/currency";
 
 export default {
   name: "edit",
@@ -461,6 +555,9 @@ export default {
     MemberSelector
   },
    created() {
+     getCurrencyList().then(response => {
+       this.currecyList = response.data;
+     })
      this.isCustomerServiceConfirmed =  this.$route.query.isCustomerServiceConfirmed ? true : false
     this.getCustomerSelect()
     this.reset()
@@ -589,11 +686,34 @@ export default {
       memberList:[],//会员列表
       selectMemberList:[],//选中会员列表
       serviceNetworkList:[], //网点列表
-      allSimplList:[]
+      allSimplList:[],
+      currecyList:[]
     }
   },
 
   methods: {
+    deleteBankData(index){
+      if(this.form.customerBankAccounts.length === 1){
+        this.$message.warning('至少添加一条银行卡号信息');
+      }else {
+          this.form.customerBankAccounts.splice(index, 1);
+      }
+    },
+    //添加银行卡
+    addBankData(){
+      let p = {
+        baAccountName: "",
+        baAccountNum: "",
+        baBankAdd: "",
+        baBankName: "",
+        baSwiftCode: "",
+        baType: null,
+        status: null,
+        currency:'',
+      };
+
+      this.form.customerBankAccounts = [...this.form.customerBankAccounts,p]
+    },
     /* getUserMemberUserFn(val){
       userMemberUserList({pageNo:1,pageSize:100,searchKey:val}).then(r => {
         this.memberList = r.data.list
@@ -672,8 +792,10 @@ export default {
       }
       this.$refs["contactForm"].validate((valid1,err1) => {
         this.$refs["form"].validate((valid2,err2) => {
-          if (!valid1 || !valid2) {
-            this.$showFormValidateErrors({...err1,...err2})
+          this.$refs.bankForm.validate((valid3,err3)=>{
+            console.log(valid3,'valid3')
+          if (!valid1 || !valid2 || !valid3) {
+            this.$showFormValidateErrors({...err1,...err2,...err3})
             return;
           }
           if (this.form.customerContacts.length === 0){
@@ -731,6 +853,7 @@ export default {
           })
         });
       })
+      })
     },
     /** 表单重置 */
     reset() {
@@ -776,12 +899,15 @@ export default {
         isShowTidanPrice:true,
         carName:undefined,
         carNo:undefined,
+        customerBankAccounts:[]
       };
       this.form.createTime = (new Date()).getTime()
       this.resetForm("form");
+      this.addBankData()
     },
     getCustomer(id) {
       return getCustomer(id).then(response => {
+        console.log(response,'response')
         this.form = { ...this.form, ...response.data, id: this.customerId,transportType:  response.data.transportType.split(',') };
         this.open = true;
         this.title = this.$t('修改客户');