Merge branch 'master' of http://116.255.135.38:3000/zhangzl/nsgk_mobile

src/api/onlineHome/bankAgriculture/paymentApproval.js

@@ -8,7 +8,14 @@ export function listTransfer(query) {
     params: query
   })
 }
-
+// 查询现金提现申请列表
+export function listCash(query) {
+  return request({
+    url: '/yinnong/cash/list',
+    method: 'get',
+    params: query
+  })
+}
 // 查询银行转账详细
 export function getTransfer(id) {
   return request({

src/router/index.js

@@ -1032,6 +1032,69 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalList'], resolve)
   },
+  {
+    path: '/approvalList2',
+    name: 'approvalList2',
+    meta: {
+      title: '信用卡转账',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalList2'], resolve)
+  },
+  {
+    path: '/approvalList3',
+    name: 'approvalList3',
+    meta: {
+      title: '虚拟挂账',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalList3'], resolve)
+  },
+  {
+    path: '/approvalList4',
+    name: 'approvalList4',
+    meta: {
+      title: '虚拟转账',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalList4'], resolve)
+  },
+  {
+    path: '/approvalList5',
+    name: 'approvalList5',
+    meta: {
+      title: '母子转张',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalList5'], resolve)
+  },
+  {
+    path: '/approvalList10',
+    name: 'approvalList10',
+    meta: {
+      title: '资金提现',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalList10'], resolve)
+  },
+  {
+    path: '/approvalList11',
+    name: 'approvalList11',
+    meta: {
+      title: '资金使用',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalList11'], resolve)
+  },
+  {
+    path: '/approvalList12',
+    name: 'approvalList12',
+    meta: {
+      title: '汇票支出',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalList12'], resolve)
+  },
   {
     path: '/approvalDetail',
     name: 'approvalDetail',
@@ -1045,11 +1108,74 @@ export const constantRoutes = [
     path: '/approvalAdd',
     name: 'approvalAdd',
     meta: {
-      title: '添加银农支付付款申请',
+      title: '添加常用转账付款申请',
       hidden: true,
     },
     component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd'], resolve)
   },
+  {
+    path: '/approvalAdd2',
+    name: 'approvalAdd2',
+    meta: {
+      title: '添加信用卡转账付款申请',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd2'], resolve)
+  },
+  {
+    path: '/approvalAdd3',
+    name: 'approvalAdd3',
+    meta: {
+      title: '添加虚拟挂账付款申请',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd3'], resolve)
+  },
+  {
+    path: '/approvalAdd4',
+    name: 'approvalAdd4',
+    meta: {
+      title: '添加虚拟转账付款申请',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd4'], resolve)
+  },
+  {
+    path: '/approvalAdd5',
+    name: 'approvalAdd5',
+    meta: {
+      title: '添加母子转账付款申请',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd5'], resolve)
+  },
+  {
+    path: '/approvalAdd10',
+    name: 'approvalAdd10',
+    meta: {
+      title: '添加资金提现付款申请',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd10'], resolve)
+  },
+  {
+    path: '/approvalAdd11',
+    name: 'approvalAdd11',
+    meta: {
+      title: '添加资金使用付款申请',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd11'], resolve)
+  },
+  {
+    path: '/approvalAdd12',
+    name: 'approvalAdd12',
+    meta: {
+      title: '添加汇票支出付款申请',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd12'], resolve)
+  },
   {
     path: '/approvalApproval',
     name: 'approvalApproval',

src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd.vue

@@ -244,7 +244,7 @@
 <script>
   import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount ,getQmyeFlow , attach} from "@/api/onlineHome/bankAgriculture/paymentApproval";
   export default {
-    name: "approvalModify",
+    name: "approvalAdd",
     data() {
       return {
         showcapital:false,
@@ -258,7 +258,7 @@
         buttonType:'a',
 
         minDate: new Date(),
-        maxDate: new Date(2025, 10, 1),
+        maxDate: new Date(2050, 10, 1),
         currentDate: new Date(),
         form:{},
         fileList:[],

src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd10.vue

@@ -0,0 +1,764 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">添加付款申请</p>
+      </template>
+    </van-nav-bar>
+    <van-form @submit="getChange" @failed="getError" :show-error-message="false" scroll-to-error validate-first>
+      <p class="main_title">基础信息</p>
+      <div class="main_box">
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择申请时间'  }]"
+          v-model="form.applyDate"
+          label="申请时间"
+          placeholder="请选择申请时间"
+          @click="showlasj = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showlasj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmLasj"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择资金支出类别' }]"
+          label="资金支出类别"
+          placeholder="请选择"
+          v-model="capitalExpenditureType"
+          @click="showcapital = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showcapital" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="capitalExpenditureTypeOptions"
+            @confirm="onConfirmCapital"
+            @cancel="showcapital = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          required
+          label="支出总金额"
+          v-model="form.expenditureAmount"
+          placeholder="根据下方收款金额自动核算"
+          input-align="right"
+          label-width="auto"
+        />
+
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field
+          label="付款事由"
+          v-model="form.remark"
+          type="textarea"
+          placeholder="请输入付款事由"
+          input-align="right"
+          rows="3"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请输入付款事由' }]"
+        />
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field label="说明情况" v-model="form.explainSituation" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      </div>
+
+      <p class="main_title" v-if="capitalExpenditureOpen">关联项目</p>
+      <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
+        <van-field
+          readonly
+          clickable
+          label="项目名称"
+          placeholder="请选择"
+          v-model="projectForm.projectName"
+          @click="showproject = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择项目名称' }]"
+        />
+        <van-popup v-model="showproject" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectListShow"
+            @confirm="onConfirmProject"
+            @cancel="showproject = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入承建单位' }]" v-model="projectForm.projectContractor" label="承建单位" placeholder="请输入承建单位" input-align="right" label-width="auto"/>
+        <van-field required :rules="[{ required: true , message:'请输入合同价款' }]" v-model="projectForm.projectAmount" label="合同价款（元）" placeholder="请输入合同价款（元）" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          label="工程款类型"
+          placeholder="请选择"
+          v-model="projectFundType"
+          @click="showFundType = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择工程款类型' }]"
+        />
+        <van-popup v-model="showFundType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectFundTypeOptions"
+            @confirm="onConfirmFundType"
+            @cancel="showFundType = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入工程发票号' }]" v-model="projectForm.projectBillNum" label="工程发票号" placeholder="请输入工程发票号" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">付款方信息</p>
+      <div class="main_box">
+        <!--      <van-field label="付款方" v-model="form.payer" placeholder="请输入付款方" input-align="right" label-width="auto"/>-->
+        <van-field
+          readonly
+          clickable
+          label="付款方"
+          placeholder="请选择付款方"
+          v-model="form.payer"
+          @click="showpayer = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请选择付款方' }]"
+        />
+        <van-popup v-model="showpayer" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="payerOptions"
+            @confirm="onConfirmPayer($event)"
+            @cancel="showpayer = false"
+          />
+        </van-popup>
+        <van-field :rules="[{ required: true , message:'请输入付款方账户' }]" required label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">收款方信息<van-button icon="plus" @click="addChargeItme(chargeItme.length)" size="mini" type="info" native-type="button" class="addFamily"/></p>
+      <div class="main_box" style="margin-bottom: 15px;">
+        <van-cell title="收款账户类型">
+          <template #right-icon>
+            <van-radio-group direction="horizontal" v-model="form.accountType" @change="accountTypeChange">
+              <van-radio name="1">公户</van-radio>
+              <van-radio name="2">私户</van-radio>
+            </van-radio-group>
+          </template>
+        </van-cell>
+      </div>
+      <div :style="{position:'relative',padding: index == 0 ? '':'10px 0 0 0'}" v-for="(item, index) in chargeItme" :key="index">
+        <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteChargeItme(index)" />
+        <div class="main_box" style="margin-bottom: 10px;position:relative;">
+          <van-field
+            readonly
+            clickable
+            label="收款方"
+            placeholder="请选择"
+            v-model="item.payee"
+            @click="item.showPayee = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择收款方' }]"
+          />
+          <van-popup v-model="item.showPayee" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="payeeList"
+              @confirm="onConfirmPayee($event,index)"
+              @cancel="item.showPayee = false"
+            />
+          </van-popup>
+          <van-field required :rules="[{ required: true , message:'请输入账户' }]" v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入银行' }]" v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入金额' }]" v-model="item.incomeAmount" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto" @change="moneyChange"/>
+          <van-field
+            readonly
+            clickable
+            label="所属银行"
+            placeholder="请选择"
+            v-model="item.bankTypeText"
+            @click="item.showbankType = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择所属银行' }]"
+          />
+          <van-popup v-model="item.showbankType" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="bankTypeDictionaries"
+              @confirm="onConfirmBankType($event,index)"
+              @cancel="item.showbankType = false"
+            />
+          </van-popup>
+        </div>
+      </div>
+      <div style="padding: 16px 0;">
+        <van-row>
+          <van-col span="12" align="center">
+<!--            @click="goUpdate"-->
+            <van-button type="info" native-type="submit" @click="buttonType='update'" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
+          </van-col>
+          <van-col span="12" align="center">
+<!--            @click="goAdd"-->
+            <van-button type="info" native-type="submit" @click="buttonType='add'" class="submitButton">保存并提交</van-button>
+          </van-col>
+        </van-row>
+        <div class="clear"></div>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script>
+  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount ,getQmyeFlow} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  export default {
+    name: "approvalAdd10",
+    data() {
+      return {
+        showcapital:false,
+        showpayee:false,
+        showlasj:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
+        showpayer:false,
+
+        buttonType:'a',
+
+        minDate: new Date(),
+        maxDate: new Date(2050, 10, 1),
+        currentDate: new Date(),
+        form:{},
+
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
+
+        wfydlxDictionaries:[],
+        jglxDictionaries:[],
+        sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
+        payerOptions:[],
+
+        chargeItme:[],
+        chargeItmeShow:[],
+
+        payeeList:[],
+        // 查询参数
+        queryParams: {
+          transferType:"",
+          orderByColumn: "id",
+          isAsc: "desc",
+        },
+        capitalExpenditureOpen:false,
+        projectForm:{
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        },
+        projectFundType:''
+      };
+    },
+    created() {
+      this.reset();
+      let queryParams={
+        pageNum: 1,
+        pageSize: 100,
+      }
+      listProject(queryParams).then(response => {
+        this.projectList = response.rows;
+        for (var i = 0; i < response.rows.length; i++) {
+          this.projectListShow.push({text: response.rows[i].projectName, value: response.rows[i].id});
+        }
+      });
+      this.getDicts("project_fund_type").then((response) => {
+        for (var i = 0; i < response.data.length; i++) {
+          this.projectFundTypeOptions.push({text: response.data[i].dictLabel, value: response.data[i].dictValue});
+        }
+        this.projectFundTypeDictionaries = response.data;
+      });
+      let params1={
+        accountType: "102",
+        status: "N",
+      }
+      getAccount(params1).then((response) => {
+        this.payerOptions = response.rows;
+        response.rows.map((res,index) => {
+          res['payerFrom'] = '1'
+          console.log(res)
+          this.payerOptions[index].text = res.accountName;
+          this.payerOptions[index].value = res.id;
+        })
+      });
+      this.getDictionaries();
+    },
+    methods: {
+      // 表单重置
+      reset() {
+        this.form = {
+          id: null,
+          upId: null,
+          downId: null,
+          orderId: null,
+          cashierId: null,
+          transferType: '1',
+          accountType: '2',
+          explainSituation: null,
+          succeedAmount: null,
+          payer: null,
+          payerAccount: null,
+          operatorCode: null,
+          enterpriseCode: null,
+          expenditureAmount: null,
+          capitalExpenditureType: '1',
+          remark: null,
+          transferStatus: "0",
+          auditStatus: "0",
+          paymentState: "1",
+          bankPriority: "0",
+          clientPriority: "0"
+        };
+        this.processList = {}
+        this.projectForm={
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        }
+      },
+      getChange(){
+        console.log(this.buttonType)
+        if(this.buttonType == 'update'){
+          console.log('update')
+          this.goUpdate();
+        }else if(this.buttonType == 'add'){
+          console.log('add')
+          this.goAdd();
+        }
+      },
+      getDictionaries(){
+        this.getDicts("capital_expenditure_type").then((res) => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.capitalExpenditureTypeOptions.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getDicts("bank_type").then(res => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.bankTypeDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getPayeeList();
+      },
+      getError(e){
+        console.log(e)
+        this.$notify({ type: 'danger', message: e.errors[0].message });
+      },
+      addChargeItme(index){
+        if(this.chargeItme.length>0&&this.chargeItme[this.chargeItme.length-1].payee == ''){
+          this.$notify({ type: 'danger', message: '请勿添加多个空列表信息' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].incomeAmount == ''){
+          this.$notify({ type: 'danger', message: '请输入收入金额！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].payeeAccount == ''){
+          this.$notify({ type: 'danger', message: '请输入收款账户！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankDeposit == ''){
+          this.$notify({ type: 'danger', message: '请输入开户银行！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankType == ''){
+          this.$notify({ type: 'danger', message: '请选择所属银行！' });
+          return;
+        }
+        this.getDicts("bank_type").then(res => {
+          this.chargeItme.splice(index + 1, 0, {
+            payeeId: "", //收款方ID
+            payee: "", //收款方
+            payeeAccount: "", //收款账户
+            bankDeposit: "", //开户银行
+            incomeAmount: "", //收入金额
+            bankType: "1", //所属银行
+            bankTypeText:this.selectDictLabel(res.data, 1), //所属银行
+            showPayee:false,
+            showbankType:false
+          });
+        });
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      payeeDictLabel(datas, value) {
+        var actions = [];
+        Object.keys(datas).some((key) => {
+          if (datas[key].payeeId == ('' + value)) {
+            actions.push(datas[key].payee);
+            return true;
+          }
+        })
+        return actions.join('');
+      },
+      onConfirmCapital(data){
+        if (data.value != 2){
+          this.capitalExpenditureOpen = false;
+          this.projectForm = [];
+        }else{
+          this.capitalExpenditureOpen = true;
+        }
+        this.capitalExpenditureType = data.text;
+        this.form.capitalExpenditureType = data.value;
+        this.showcapital = false;
+      },
+      onConfirmFundType(data){
+        console.log(data)
+        this.projectForm.projectFundType = data.value;
+        this.projectFundType = data.text;
+        this.showFundType = false;
+      },
+      onConfirmProject(data){
+        this.projectList.map(res => {
+          if(res.projectName==data.text){
+            this.projectForm.projectId = res.id
+            this.projectForm.projectName = res.projectName
+            this.projectForm.projectContractor = res.projectContractor
+            this.projectForm.projectAmount = res.projectAmount
+          }
+        })
+        this.showproject = false;
+      },
+      onConfirmPayee(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showPayee = false;
+        }
+        this.chargeItme[index].payee = data.text;
+        this.chargeItme[index].payeeId = data.value;
+        this.chargeItme[index].showpayee = false;
+        this.payeeSelectChange(data.value , index)
+      },
+      onConfirmBankType(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showbankType = false;
+        }
+        this.chargeItme[index].bankTypeText = data.text;
+        this.chargeItme[index].bankType = data.value;
+        this.chargeItme[index].showbankType = false;
+      },
+      onConfirmPayer(data){
+        this.form.payer = data.text;
+        this.form.cashierId = data.value;
+        this.showpayer = false;
+        this.selectChange(data.value)
+      },
+      onConfirmLasj(data){
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
+        this.showlasj = false;
+      },
+      accountTypeChange(e){
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      // 钱计算
+      moneyChange(input) {
+        console.log(input)
+        let obj = {};
+        obj = this.chargeItme.find((account) => {
+          //model就是上面的数据源
+          return parseFloat(account.incomeAmount).toFixed(2) === input; //筛选出匹配数据
+        });
+        let total = 0;
+        this.chargeItme.forEach((money) => {
+          total = (parseFloat(total) + parseFloat(money.incomeAmount)).toFixed(2)
+        });
+        this.$set(this.form, "expenditureAmount", total);
+      },
+      goAdd(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        addTransfer(this.form).then(response => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              customSubmit(response.data.id).then(res => {
+                this.$toast.success('提交成功');
+                setTimeout(function(){
+                  history.go(-1)
+                },2000)
+              })
+            })
+          }else{
+            customSubmit(response.data.id).then(res => {
+              this.$toast.success('提交成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }
+        });
+      },
+      goUpdate(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        this.projectForm.outId = this.form.id
+        addTransfer(this.form).then((response) => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              this.$toast.success('保存成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }else{
+            this.$toast.success('保存成功');
+            setTimeout(function(){
+              history.go(-1)
+            },2000)
+          }
+        });
+      },
+      payeeSelectChange(select, i) {
+        let obj = {};
+        let fuzhitype = 0;
+        obj = this.payeeList.find((account) => {
+          //model就是上面的数据源
+          return account.id === select ; //筛选出匹配数据
+        });
+        if(this.chargeItme != [] && this.chargeItme.length>1){
+          this.chargeItme.some((value, index) => {
+            if(value.payeeAccount != undefined &&value.payeeAccount != '' && obj.payeeAccount == value.payeeAccount&&index!=i){
+              fuzhitype = 2;
+              return true;
+            }
+            if(value.accountType != undefined &&value.accountType != '' && obj.accountType != value.accountType&&index!=i){
+              fuzhitype = 1;
+              return true;
+            }
+          });
+        }
+        if(fuzhitype == 0){
+          this.$set(this.chargeItme[i], "payee",obj.payee)
+          this.$set(this.chargeItme[i], "bankType", obj.bankType)
+          this.$set(this.chargeItme[i], "payeeId", obj.id);
+          this.$set(this.chargeItme[i], "payeeAccount", obj.payeeAccount);
+          this.$set(this.chargeItme[i], "bankDeposit", obj.bankDeposit);
+          this.$set(this.chargeItme[i], "accountType", obj.accountType);
+        }else if(fuzhitype == 1){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '请选择账户类型相同的收款方！' });
+        }else if(fuzhitype == 2){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '收款方已存在！' });
+        }
+      },
+      selectChange(select) {
+        let obj = {};
+        obj = this.payerOptions.find((account) => {
+          //model就是上面的数据源
+          return account.id === select; //筛选出匹配数据
+        });
+        if(obj.payerFrom==1&&obj.operatorCode != null && obj.operatorCode != "" &&
+          obj.enterpriseCode != null && obj.enterpriseCode != "" &&
+          obj.accountPassword != null && obj.accountPassword != ""){
+          this.$set(this.form, "bookId", obj.bookId);
+          this.$set(this.form, "deptId", obj.deptId);
+          this.$set(this.form, "cashierId", obj.id);
+          this.$set(this.form, "payer", obj.accountName);
+          this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+          this.$set(this.form, "operatorCode", obj.operatorCode);
+          this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+          this.$set(this.form, "payerFrom", '1');
+        }else{
+          if(obj.payerFrom==1){
+            this.diglogStatus = false;
+            this.$notify({ type: 'danger', message: "请完善付款方“操作员代码”、“企业编码”、“支付口令”等信息！" });
+            this.$set(this.form,"payer","")
+            this.$set(this.form,"payerAccount","")
+          }else{
+            this.$set(this.form, "payerFrom", obj.parerFrom);
+            if(obj.operatorCode!=null&&obj.operatorCode!=''){
+              this.$set(this.form, "operatorCode", obj.operatorCode);
+            }else{
+              this.$set(this.form, "operatorCode", '');
+            }
+            if(obj.enterpriseCode!=null&&obj.enterpriseCode!=''){
+              this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+            }else{
+              this.$set(this.form, "enterpriseCode", '');
+            }
+            if(obj.accountPassword!=null&&obj.accountPassword!=''){
+              this.$set(this.form, "accountPassword", obj.accountPassword);
+            }else{
+              this.$set(this.form, "accountPassword", '');
+            }
+            this.$set(this.form, "bookId",'');
+            this.$set(this.form, "deptId", '');
+            this.$set(this.form, "cashierId", obj.id);
+            this.$set(this.form, "payer", obj.accountName);
+            if(obj.payerFrom==6){
+              getQmyeFlow(obj.bankAccountNumber).then((response) => {
+                this.$set(this.form, "payerAccount", response.data);
+              });
+            }else {
+              this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+            }
+          }
+        }
+      },
+      goBack(){
+        window.history.go(-1)
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+  }
+
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd11.vue

@@ -0,0 +1,764 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">添加付款申请</p>
+      </template>
+    </van-nav-bar>
+    <van-form @submit="getChange" @failed="getError" :show-error-message="false" scroll-to-error validate-first>
+      <p class="main_title">基础信息</p>
+      <div class="main_box">
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择申请时间'  }]"
+          v-model="form.applyDate"
+          label="申请时间"
+          placeholder="请选择申请时间"
+          @click="showlasj = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showlasj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmLasj"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择资金支出类别' }]"
+          label="资金支出类别"
+          placeholder="请选择"
+          v-model="capitalExpenditureType"
+          @click="showcapital = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showcapital" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="capitalExpenditureTypeOptions"
+            @confirm="onConfirmCapital"
+            @cancel="showcapital = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          required
+          label="支出总金额"
+          v-model="form.expenditureAmount"
+          placeholder="根据下方收款金额自动核算"
+          input-align="right"
+          label-width="auto"
+        />
+
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field
+          label="付款事由"
+          v-model="form.remark"
+          type="textarea"
+          placeholder="请输入付款事由"
+          input-align="right"
+          rows="3"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请输入付款事由' }]"
+        />
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field label="说明情况" v-model="form.explainSituation" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      </div>
+
+      <p class="main_title" v-if="capitalExpenditureOpen">关联项目</p>
+      <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
+        <van-field
+          readonly
+          clickable
+          label="项目名称"
+          placeholder="请选择"
+          v-model="projectForm.projectName"
+          @click="showproject = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择项目名称' }]"
+        />
+        <van-popup v-model="showproject" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectListShow"
+            @confirm="onConfirmProject"
+            @cancel="showproject = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入承建单位' }]" v-model="projectForm.projectContractor" label="承建单位" placeholder="请输入承建单位" input-align="right" label-width="auto"/>
+        <van-field required :rules="[{ required: true , message:'请输入合同价款' }]" v-model="projectForm.projectAmount" label="合同价款（元）" placeholder="请输入合同价款（元）" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          label="工程款类型"
+          placeholder="请选择"
+          v-model="projectFundType"
+          @click="showFundType = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择工程款类型' }]"
+        />
+        <van-popup v-model="showFundType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectFundTypeOptions"
+            @confirm="onConfirmFundType"
+            @cancel="showFundType = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入工程发票号' }]" v-model="projectForm.projectBillNum" label="工程发票号" placeholder="请输入工程发票号" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">付款方信息</p>
+      <div class="main_box">
+        <!--      <van-field label="付款方" v-model="form.payer" placeholder="请输入付款方" input-align="right" label-width="auto"/>-->
+        <van-field
+          readonly
+          clickable
+          label="付款方"
+          placeholder="请选择付款方"
+          v-model="form.payer"
+          @click="showpayer = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请选择付款方' }]"
+        />
+        <van-popup v-model="showpayer" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="payerOptions"
+            @confirm="onConfirmPayer($event)"
+            @cancel="showpayer = false"
+          />
+        </van-popup>
+        <van-field :rules="[{ required: true , message:'请输入付款方账户' }]" required label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">收款方信息<van-button icon="plus" @click="addChargeItme(chargeItme.length)" size="mini" type="info" native-type="button" class="addFamily"/></p>
+      <div class="main_box" style="margin-bottom: 15px;">
+        <van-cell title="收款账户类型">
+          <template #right-icon>
+            <van-radio-group direction="horizontal" v-model="form.accountType" @change="accountTypeChange">
+              <van-radio name="1">公户</van-radio>
+              <van-radio name="2">私户</van-radio>
+            </van-radio-group>
+          </template>
+        </van-cell>
+      </div>
+      <div :style="{position:'relative',padding: index == 0 ? '':'10px 0 0 0'}" v-for="(item, index) in chargeItme" :key="index">
+        <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteChargeItme(index)" />
+        <div class="main_box" style="margin-bottom: 10px;position:relative;">
+          <van-field
+            readonly
+            clickable
+            label="收款方"
+            placeholder="请选择"
+            v-model="item.payee"
+            @click="item.showPayee = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择收款方' }]"
+          />
+          <van-popup v-model="item.showPayee" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="payeeList"
+              @confirm="onConfirmPayee($event,index)"
+              @cancel="item.showPayee = false"
+            />
+          </van-popup>
+          <van-field required :rules="[{ required: true , message:'请输入账户' }]" v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入银行' }]" v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入金额' }]" v-model="item.incomeAmount" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto" @change="moneyChange"/>
+          <van-field
+            readonly
+            clickable
+            label="所属银行"
+            placeholder="请选择"
+            v-model="item.bankTypeText"
+            @click="item.showbankType = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择所属银行' }]"
+          />
+          <van-popup v-model="item.showbankType" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="bankTypeDictionaries"
+              @confirm="onConfirmBankType($event,index)"
+              @cancel="item.showbankType = false"
+            />
+          </van-popup>
+        </div>
+      </div>
+      <div style="padding: 16px 0;">
+        <van-row>
+          <van-col span="12" align="center">
+<!--            @click="goUpdate"-->
+            <van-button type="info" native-type="submit" @click="buttonType='update'" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
+          </van-col>
+          <van-col span="12" align="center">
+<!--            @click="goAdd"-->
+            <van-button type="info" native-type="submit" @click="buttonType='add'" class="submitButton">保存并提交</van-button>
+          </van-col>
+        </van-row>
+        <div class="clear"></div>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script>
+  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount ,getQmyeFlow} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  export default {
+    name: "approvalAdd11",
+    data() {
+      return {
+        showcapital:false,
+        showpayee:false,
+        showlasj:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
+        showpayer:false,
+
+        buttonType:'a',
+
+        minDate: new Date(),
+        maxDate: new Date(2050, 10, 1),
+        currentDate: new Date(),
+        form:{},
+
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
+
+        wfydlxDictionaries:[],
+        jglxDictionaries:[],
+        sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
+        payerOptions:[],
+
+        chargeItme:[],
+        chargeItmeShow:[],
+
+        payeeList:[],
+        // 查询参数
+        queryParams: {
+          transferType:"",
+          orderByColumn: "id",
+          isAsc: "desc",
+        },
+        capitalExpenditureOpen:false,
+        projectForm:{
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        },
+        projectFundType:''
+      };
+    },
+    created() {
+      this.reset();
+      let queryParams={
+        pageNum: 1,
+        pageSize: 100,
+      }
+      listProject(queryParams).then(response => {
+        this.projectList = response.rows;
+        for (var i = 0; i < response.rows.length; i++) {
+          this.projectListShow.push({text: response.rows[i].projectName, value: response.rows[i].id});
+        }
+      });
+      this.getDicts("project_fund_type").then((response) => {
+        for (var i = 0; i < response.data.length; i++) {
+          this.projectFundTypeOptions.push({text: response.data[i].dictLabel, value: response.data[i].dictValue});
+        }
+        this.projectFundTypeDictionaries = response.data;
+      });
+      let params1={
+        accountType: "102",
+        status: "N",
+      }
+      getAccount(params1).then((response) => {
+        this.payerOptions = response.rows;
+        response.rows.map((res,index) => {
+          res['payerFrom'] = '1'
+          console.log(res)
+          this.payerOptions[index].text = res.accountName;
+          this.payerOptions[index].value = res.id;
+        })
+      });
+      this.getDictionaries();
+    },
+    methods: {
+      // 表单重置
+      reset() {
+        this.form = {
+          id: null,
+          upId: null,
+          downId: null,
+          orderId: null,
+          cashierId: null,
+          transferType: '1',
+          accountType: '2',
+          explainSituation: null,
+          succeedAmount: null,
+          payer: null,
+          payerAccount: null,
+          operatorCode: null,
+          enterpriseCode: null,
+          expenditureAmount: null,
+          capitalExpenditureType: '1',
+          remark: null,
+          transferStatus: "0",
+          auditStatus: "0",
+          paymentState: "1",
+          bankPriority: "0",
+          clientPriority: "0"
+        };
+        this.processList = {}
+        this.projectForm={
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        }
+      },
+      getChange(){
+        console.log(this.buttonType)
+        if(this.buttonType == 'update'){
+          console.log('update')
+          this.goUpdate();
+        }else if(this.buttonType == 'add'){
+          console.log('add')
+          this.goAdd();
+        }
+      },
+      getDictionaries(){
+        this.getDicts("capital_expenditure_type").then((res) => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.capitalExpenditureTypeOptions.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getDicts("bank_type").then(res => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.bankTypeDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getPayeeList();
+      },
+      getError(e){
+        console.log(e)
+        this.$notify({ type: 'danger', message: e.errors[0].message });
+      },
+      addChargeItme(index){
+        if(this.chargeItme.length>0&&this.chargeItme[this.chargeItme.length-1].payee == ''){
+          this.$notify({ type: 'danger', message: '请勿添加多个空列表信息' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].incomeAmount == ''){
+          this.$notify({ type: 'danger', message: '请输入收入金额！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].payeeAccount == ''){
+          this.$notify({ type: 'danger', message: '请输入收款账户！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankDeposit == ''){
+          this.$notify({ type: 'danger', message: '请输入开户银行！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankType == ''){
+          this.$notify({ type: 'danger', message: '请选择所属银行！' });
+          return;
+        }
+        this.getDicts("bank_type").then(res => {
+          this.chargeItme.splice(index + 1, 0, {
+            payeeId: "", //收款方ID
+            payee: "", //收款方
+            payeeAccount: "", //收款账户
+            bankDeposit: "", //开户银行
+            incomeAmount: "", //收入金额
+            bankType: "1", //所属银行
+            bankTypeText:this.selectDictLabel(res.data, 1), //所属银行
+            showPayee:false,
+            showbankType:false
+          });
+        });
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      payeeDictLabel(datas, value) {
+        var actions = [];
+        Object.keys(datas).some((key) => {
+          if (datas[key].payeeId == ('' + value)) {
+            actions.push(datas[key].payee);
+            return true;
+          }
+        })
+        return actions.join('');
+      },
+      onConfirmCapital(data){
+        if (data.value != 2){
+          this.capitalExpenditureOpen = false;
+          this.projectForm = [];
+        }else{
+          this.capitalExpenditureOpen = true;
+        }
+        this.capitalExpenditureType = data.text;
+        this.form.capitalExpenditureType = data.value;
+        this.showcapital = false;
+      },
+      onConfirmFundType(data){
+        console.log(data)
+        this.projectForm.projectFundType = data.value;
+        this.projectFundType = data.text;
+        this.showFundType = false;
+      },
+      onConfirmProject(data){
+        this.projectList.map(res => {
+          if(res.projectName==data.text){
+            this.projectForm.projectId = res.id
+            this.projectForm.projectName = res.projectName
+            this.projectForm.projectContractor = res.projectContractor
+            this.projectForm.projectAmount = res.projectAmount
+          }
+        })
+        this.showproject = false;
+      },
+      onConfirmPayee(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showPayee = false;
+        }
+        this.chargeItme[index].payee = data.text;
+        this.chargeItme[index].payeeId = data.value;
+        this.chargeItme[index].showpayee = false;
+        this.payeeSelectChange(data.value , index)
+      },
+      onConfirmBankType(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showbankType = false;
+        }
+        this.chargeItme[index].bankTypeText = data.text;
+        this.chargeItme[index].bankType = data.value;
+        this.chargeItme[index].showbankType = false;
+      },
+      onConfirmPayer(data){
+        this.form.payer = data.text;
+        this.form.cashierId = data.value;
+        this.showpayer = false;
+        this.selectChange(data.value)
+      },
+      onConfirmLasj(data){
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
+        this.showlasj = false;
+      },
+      accountTypeChange(e){
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      // 钱计算
+      moneyChange(input) {
+        console.log(input)
+        let obj = {};
+        obj = this.chargeItme.find((account) => {
+          //model就是上面的数据源
+          return parseFloat(account.incomeAmount).toFixed(2) === input; //筛选出匹配数据
+        });
+        let total = 0;
+        this.chargeItme.forEach((money) => {
+          total = (parseFloat(total) + parseFloat(money.incomeAmount)).toFixed(2)
+        });
+        this.$set(this.form, "expenditureAmount", total);
+      },
+      goAdd(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        addTransfer(this.form).then(response => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              customSubmit(response.data.id).then(res => {
+                this.$toast.success('提交成功');
+                setTimeout(function(){
+                  history.go(-1)
+                },2000)
+              })
+            })
+          }else{
+            customSubmit(response.data.id).then(res => {
+              this.$toast.success('提交成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }
+        });
+      },
+      goUpdate(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        this.projectForm.outId = this.form.id
+        addTransfer(this.form).then((response) => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              this.$toast.success('保存成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }else{
+            this.$toast.success('保存成功');
+            setTimeout(function(){
+              history.go(-1)
+            },2000)
+          }
+        });
+      },
+      payeeSelectChange(select, i) {
+        let obj = {};
+        let fuzhitype = 0;
+        obj = this.payeeList.find((account) => {
+          //model就是上面的数据源
+          return account.id === select ; //筛选出匹配数据
+        });
+        if(this.chargeItme != [] && this.chargeItme.length>1){
+          this.chargeItme.some((value, index) => {
+            if(value.payeeAccount != undefined &&value.payeeAccount != '' && obj.payeeAccount == value.payeeAccount&&index!=i){
+              fuzhitype = 2;
+              return true;
+            }
+            if(value.accountType != undefined &&value.accountType != '' && obj.accountType != value.accountType&&index!=i){
+              fuzhitype = 1;
+              return true;
+            }
+          });
+        }
+        if(fuzhitype == 0){
+          this.$set(this.chargeItme[i], "payee",obj.payee)
+          this.$set(this.chargeItme[i], "bankType", obj.bankType)
+          this.$set(this.chargeItme[i], "payeeId", obj.id);
+          this.$set(this.chargeItme[i], "payeeAccount", obj.payeeAccount);
+          this.$set(this.chargeItme[i], "bankDeposit", obj.bankDeposit);
+          this.$set(this.chargeItme[i], "accountType", obj.accountType);
+        }else if(fuzhitype == 1){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '请选择账户类型相同的收款方！' });
+        }else if(fuzhitype == 2){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '收款方已存在！' });
+        }
+      },
+      selectChange(select) {
+        let obj = {};
+        obj = this.payerOptions.find((account) => {
+          //model就是上面的数据源
+          return account.id === select; //筛选出匹配数据
+        });
+        if(obj.payerFrom==1&&obj.operatorCode != null && obj.operatorCode != "" &&
+          obj.enterpriseCode != null && obj.enterpriseCode != "" &&
+          obj.accountPassword != null && obj.accountPassword != ""){
+          this.$set(this.form, "bookId", obj.bookId);
+          this.$set(this.form, "deptId", obj.deptId);
+          this.$set(this.form, "cashierId", obj.id);
+          this.$set(this.form, "payer", obj.accountName);
+          this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+          this.$set(this.form, "operatorCode", obj.operatorCode);
+          this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+          this.$set(this.form, "payerFrom", '1');
+        }else{
+          if(obj.payerFrom==1){
+            this.diglogStatus = false;
+            this.$notify({ type: 'danger', message: "请完善付款方“操作员代码”、“企业编码”、“支付口令”等信息！" });
+            this.$set(this.form,"payer","")
+            this.$set(this.form,"payerAccount","")
+          }else{
+            this.$set(this.form, "payerFrom", obj.parerFrom);
+            if(obj.operatorCode!=null&&obj.operatorCode!=''){
+              this.$set(this.form, "operatorCode", obj.operatorCode);
+            }else{
+              this.$set(this.form, "operatorCode", '');
+            }
+            if(obj.enterpriseCode!=null&&obj.enterpriseCode!=''){
+              this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+            }else{
+              this.$set(this.form, "enterpriseCode", '');
+            }
+            if(obj.accountPassword!=null&&obj.accountPassword!=''){
+              this.$set(this.form, "accountPassword", obj.accountPassword);
+            }else{
+              this.$set(this.form, "accountPassword", '');
+            }
+            this.$set(this.form, "bookId",'');
+            this.$set(this.form, "deptId", '');
+            this.$set(this.form, "cashierId", obj.id);
+            this.$set(this.form, "payer", obj.accountName);
+            if(obj.payerFrom==6){
+              getQmyeFlow(obj.bankAccountNumber).then((response) => {
+                this.$set(this.form, "payerAccount", response.data);
+              });
+            }else {
+              this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+            }
+          }
+        }
+      },
+      goBack(){
+        window.history.go(-1)
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+  }
+
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd12.vue

@@ -0,0 +1,764 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">添加付款申请</p>
+      </template>
+    </van-nav-bar>
+    <van-form @submit="getChange" @failed="getError" :show-error-message="false" scroll-to-error validate-first>
+      <p class="main_title">基础信息</p>
+      <div class="main_box">
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择申请时间'  }]"
+          v-model="form.applyDate"
+          label="申请时间"
+          placeholder="请选择申请时间"
+          @click="showlasj = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showlasj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmLasj"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择资金支出类别' }]"
+          label="资金支出类别"
+          placeholder="请选择"
+          v-model="capitalExpenditureType"
+          @click="showcapital = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showcapital" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="capitalExpenditureTypeOptions"
+            @confirm="onConfirmCapital"
+            @cancel="showcapital = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          required
+          label="支出总金额"
+          v-model="form.expenditureAmount"
+          placeholder="根据下方收款金额自动核算"
+          input-align="right"
+          label-width="auto"
+        />
+
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field
+          label="付款事由"
+          v-model="form.remark"
+          type="textarea"
+          placeholder="请输入付款事由"
+          input-align="right"
+          rows="3"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请输入付款事由' }]"
+        />
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field label="说明情况" v-model="form.explainSituation" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      </div>
+
+      <p class="main_title" v-if="capitalExpenditureOpen">关联项目</p>
+      <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
+        <van-field
+          readonly
+          clickable
+          label="项目名称"
+          placeholder="请选择"
+          v-model="projectForm.projectName"
+          @click="showproject = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择项目名称' }]"
+        />
+        <van-popup v-model="showproject" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectListShow"
+            @confirm="onConfirmProject"
+            @cancel="showproject = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入承建单位' }]" v-model="projectForm.projectContractor" label="承建单位" placeholder="请输入承建单位" input-align="right" label-width="auto"/>
+        <van-field required :rules="[{ required: true , message:'请输入合同价款' }]" v-model="projectForm.projectAmount" label="合同价款（元）" placeholder="请输入合同价款（元）" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          label="工程款类型"
+          placeholder="请选择"
+          v-model="projectFundType"
+          @click="showFundType = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择工程款类型' }]"
+        />
+        <van-popup v-model="showFundType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectFundTypeOptions"
+            @confirm="onConfirmFundType"
+            @cancel="showFundType = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入工程发票号' }]" v-model="projectForm.projectBillNum" label="工程发票号" placeholder="请输入工程发票号" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">付款方信息</p>
+      <div class="main_box">
+        <!--      <van-field label="付款方" v-model="form.payer" placeholder="请输入付款方" input-align="right" label-width="auto"/>-->
+        <van-field
+          readonly
+          clickable
+          label="付款方"
+          placeholder="请选择付款方"
+          v-model="form.payer"
+          @click="showpayer = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请选择付款方' }]"
+        />
+        <van-popup v-model="showpayer" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="payerOptions"
+            @confirm="onConfirmPayer($event)"
+            @cancel="showpayer = false"
+          />
+        </van-popup>
+        <van-field :rules="[{ required: true , message:'请输入付款方账户' }]" required label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">收款方信息<van-button icon="plus" @click="addChargeItme(chargeItme.length)" size="mini" type="info" native-type="button" class="addFamily"/></p>
+      <div class="main_box" style="margin-bottom: 15px;">
+        <van-cell title="收款账户类型">
+          <template #right-icon>
+            <van-radio-group direction="horizontal" v-model="form.accountType" @change="accountTypeChange">
+              <van-radio name="1">公户</van-radio>
+              <van-radio name="2">私户</van-radio>
+            </van-radio-group>
+          </template>
+        </van-cell>
+      </div>
+      <div :style="{position:'relative',padding: index == 0 ? '':'10px 0 0 0'}" v-for="(item, index) in chargeItme" :key="index">
+        <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteChargeItme(index)" />
+        <div class="main_box" style="margin-bottom: 10px;position:relative;">
+          <van-field
+            readonly
+            clickable
+            label="收款方"
+            placeholder="请选择"
+            v-model="item.payee"
+            @click="item.showPayee = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择收款方' }]"
+          />
+          <van-popup v-model="item.showPayee" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="payeeList"
+              @confirm="onConfirmPayee($event,index)"
+              @cancel="item.showPayee = false"
+            />
+          </van-popup>
+          <van-field required :rules="[{ required: true , message:'请输入账户' }]" v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入银行' }]" v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入金额' }]" v-model="item.incomeAmount" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto" @change="moneyChange"/>
+          <van-field
+            readonly
+            clickable
+            label="所属银行"
+            placeholder="请选择"
+            v-model="item.bankTypeText"
+            @click="item.showbankType = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择所属银行' }]"
+          />
+          <van-popup v-model="item.showbankType" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="bankTypeDictionaries"
+              @confirm="onConfirmBankType($event,index)"
+              @cancel="item.showbankType = false"
+            />
+          </van-popup>
+        </div>
+      </div>
+      <div style="padding: 16px 0;">
+        <van-row>
+          <van-col span="12" align="center">
+<!--            @click="goUpdate"-->
+            <van-button type="info" native-type="submit" @click="buttonType='update'" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
+          </van-col>
+          <van-col span="12" align="center">
+<!--            @click="goAdd"-->
+            <van-button type="info" native-type="submit" @click="buttonType='add'" class="submitButton">保存并提交</van-button>
+          </van-col>
+        </van-row>
+        <div class="clear"></div>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script>
+  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount ,getQmyeFlow} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  export default {
+    name: "approvalAdd12",
+    data() {
+      return {
+        showcapital:false,
+        showpayee:false,
+        showlasj:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
+        showpayer:false,
+
+        buttonType:'a',
+
+        minDate: new Date(),
+        maxDate: new Date(2050, 10, 1),
+        currentDate: new Date(),
+        form:{},
+
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
+
+        wfydlxDictionaries:[],
+        jglxDictionaries:[],
+        sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
+        payerOptions:[],
+
+        chargeItme:[],
+        chargeItmeShow:[],
+
+        payeeList:[],
+        // 查询参数
+        queryParams: {
+          transferType:"",
+          orderByColumn: "id",
+          isAsc: "desc",
+        },
+        capitalExpenditureOpen:false,
+        projectForm:{
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        },
+        projectFundType:''
+      };
+    },
+    created() {
+      this.reset();
+      let queryParams={
+        pageNum: 1,
+        pageSize: 100,
+      }
+      listProject(queryParams).then(response => {
+        this.projectList = response.rows;
+        for (var i = 0; i < response.rows.length; i++) {
+          this.projectListShow.push({text: response.rows[i].projectName, value: response.rows[i].id});
+        }
+      });
+      this.getDicts("project_fund_type").then((response) => {
+        for (var i = 0; i < response.data.length; i++) {
+          this.projectFundTypeOptions.push({text: response.data[i].dictLabel, value: response.data[i].dictValue});
+        }
+        this.projectFundTypeDictionaries = response.data;
+      });
+      let params1={
+        accountType: "102",
+        status: "N",
+      }
+      getAccount(params1).then((response) => {
+        this.payerOptions = response.rows;
+        response.rows.map((res,index) => {
+          res['payerFrom'] = '1'
+          console.log(res)
+          this.payerOptions[index].text = res.accountName;
+          this.payerOptions[index].value = res.id;
+        })
+      });
+      this.getDictionaries();
+    },
+    methods: {
+      // 表单重置
+      reset() {
+        this.form = {
+          id: null,
+          upId: null,
+          downId: null,
+          orderId: null,
+          cashierId: null,
+          transferType: '1',
+          accountType: '2',
+          explainSituation: null,
+          succeedAmount: null,
+          payer: null,
+          payerAccount: null,
+          operatorCode: null,
+          enterpriseCode: null,
+          expenditureAmount: null,
+          capitalExpenditureType: '1',
+          remark: null,
+          transferStatus: "0",
+          auditStatus: "0",
+          paymentState: "1",
+          bankPriority: "0",
+          clientPriority: "0"
+        };
+        this.processList = {}
+        this.projectForm={
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        }
+      },
+      getChange(){
+        console.log(this.buttonType)
+        if(this.buttonType == 'update'){
+          console.log('update')
+          this.goUpdate();
+        }else if(this.buttonType == 'add'){
+          console.log('add')
+          this.goAdd();
+        }
+      },
+      getDictionaries(){
+        this.getDicts("capital_expenditure_type").then((res) => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.capitalExpenditureTypeOptions.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getDicts("bank_type").then(res => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.bankTypeDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getPayeeList();
+      },
+      getError(e){
+        console.log(e)
+        this.$notify({ type: 'danger', message: e.errors[0].message });
+      },
+      addChargeItme(index){
+        if(this.chargeItme.length>0&&this.chargeItme[this.chargeItme.length-1].payee == ''){
+          this.$notify({ type: 'danger', message: '请勿添加多个空列表信息' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].incomeAmount == ''){
+          this.$notify({ type: 'danger', message: '请输入收入金额！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].payeeAccount == ''){
+          this.$notify({ type: 'danger', message: '请输入收款账户！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankDeposit == ''){
+          this.$notify({ type: 'danger', message: '请输入开户银行！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankType == ''){
+          this.$notify({ type: 'danger', message: '请选择所属银行！' });
+          return;
+        }
+        this.getDicts("bank_type").then(res => {
+          this.chargeItme.splice(index + 1, 0, {
+            payeeId: "", //收款方ID
+            payee: "", //收款方
+            payeeAccount: "", //收款账户
+            bankDeposit: "", //开户银行
+            incomeAmount: "", //收入金额
+            bankType: "1", //所属银行
+            bankTypeText:this.selectDictLabel(res.data, 1), //所属银行
+            showPayee:false,
+            showbankType:false
+          });
+        });
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      payeeDictLabel(datas, value) {
+        var actions = [];
+        Object.keys(datas).some((key) => {
+          if (datas[key].payeeId == ('' + value)) {
+            actions.push(datas[key].payee);
+            return true;
+          }
+        })
+        return actions.join('');
+      },
+      onConfirmCapital(data){
+        if (data.value != 2){
+          this.capitalExpenditureOpen = false;
+          this.projectForm = [];
+        }else{
+          this.capitalExpenditureOpen = true;
+        }
+        this.capitalExpenditureType = data.text;
+        this.form.capitalExpenditureType = data.value;
+        this.showcapital = false;
+      },
+      onConfirmFundType(data){
+        console.log(data)
+        this.projectForm.projectFundType = data.value;
+        this.projectFundType = data.text;
+        this.showFundType = false;
+      },
+      onConfirmProject(data){
+        this.projectList.map(res => {
+          if(res.projectName==data.text){
+            this.projectForm.projectId = res.id
+            this.projectForm.projectName = res.projectName
+            this.projectForm.projectContractor = res.projectContractor
+            this.projectForm.projectAmount = res.projectAmount
+          }
+        })
+        this.showproject = false;
+      },
+      onConfirmPayee(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showPayee = false;
+        }
+        this.chargeItme[index].payee = data.text;
+        this.chargeItme[index].payeeId = data.value;
+        this.chargeItme[index].showpayee = false;
+        this.payeeSelectChange(data.value , index)
+      },
+      onConfirmBankType(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showbankType = false;
+        }
+        this.chargeItme[index].bankTypeText = data.text;
+        this.chargeItme[index].bankType = data.value;
+        this.chargeItme[index].showbankType = false;
+      },
+      onConfirmPayer(data){
+        this.form.payer = data.text;
+        this.form.cashierId = data.value;
+        this.showpayer = false;
+        this.selectChange(data.value)
+      },
+      onConfirmLasj(data){
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
+        this.showlasj = false;
+      },
+      accountTypeChange(e){
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      // 钱计算
+      moneyChange(input) {
+        console.log(input)
+        let obj = {};
+        obj = this.chargeItme.find((account) => {
+          //model就是上面的数据源
+          return parseFloat(account.incomeAmount).toFixed(2) === input; //筛选出匹配数据
+        });
+        let total = 0;
+        this.chargeItme.forEach((money) => {
+          total = (parseFloat(total) + parseFloat(money.incomeAmount)).toFixed(2)
+        });
+        this.$set(this.form, "expenditureAmount", total);
+      },
+      goAdd(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        addTransfer(this.form).then(response => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              customSubmit(response.data.id).then(res => {
+                this.$toast.success('提交成功');
+                setTimeout(function(){
+                  history.go(-1)
+                },2000)
+              })
+            })
+          }else{
+            customSubmit(response.data.id).then(res => {
+              this.$toast.success('提交成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }
+        });
+      },
+      goUpdate(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        this.projectForm.outId = this.form.id
+        addTransfer(this.form).then((response) => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              this.$toast.success('保存成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }else{
+            this.$toast.success('保存成功');
+            setTimeout(function(){
+              history.go(-1)
+            },2000)
+          }
+        });
+      },
+      payeeSelectChange(select, i) {
+        let obj = {};
+        let fuzhitype = 0;
+        obj = this.payeeList.find((account) => {
+          //model就是上面的数据源
+          return account.id === select ; //筛选出匹配数据
+        });
+        if(this.chargeItme != [] && this.chargeItme.length>1){
+          this.chargeItme.some((value, index) => {
+            if(value.payeeAccount != undefined &&value.payeeAccount != '' && obj.payeeAccount == value.payeeAccount&&index!=i){
+              fuzhitype = 2;
+              return true;
+            }
+            if(value.accountType != undefined &&value.accountType != '' && obj.accountType != value.accountType&&index!=i){
+              fuzhitype = 1;
+              return true;
+            }
+          });
+        }
+        if(fuzhitype == 0){
+          this.$set(this.chargeItme[i], "payee",obj.payee)
+          this.$set(this.chargeItme[i], "bankType", obj.bankType)
+          this.$set(this.chargeItme[i], "payeeId", obj.id);
+          this.$set(this.chargeItme[i], "payeeAccount", obj.payeeAccount);
+          this.$set(this.chargeItme[i], "bankDeposit", obj.bankDeposit);
+          this.$set(this.chargeItme[i], "accountType", obj.accountType);
+        }else if(fuzhitype == 1){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '请选择账户类型相同的收款方！' });
+        }else if(fuzhitype == 2){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '收款方已存在！' });
+        }
+      },
+      selectChange(select) {
+        let obj = {};
+        obj = this.payerOptions.find((account) => {
+          //model就是上面的数据源
+          return account.id === select; //筛选出匹配数据
+        });
+        if(obj.payerFrom==1&&obj.operatorCode != null && obj.operatorCode != "" &&
+          obj.enterpriseCode != null && obj.enterpriseCode != "" &&
+          obj.accountPassword != null && obj.accountPassword != ""){
+          this.$set(this.form, "bookId", obj.bookId);
+          this.$set(this.form, "deptId", obj.deptId);
+          this.$set(this.form, "cashierId", obj.id);
+          this.$set(this.form, "payer", obj.accountName);
+          this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+          this.$set(this.form, "operatorCode", obj.operatorCode);
+          this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+          this.$set(this.form, "payerFrom", '1');
+        }else{
+          if(obj.payerFrom==1){
+            this.diglogStatus = false;
+            this.$notify({ type: 'danger', message: "请完善付款方“操作员代码”、“企业编码”、“支付口令”等信息！" });
+            this.$set(this.form,"payer","")
+            this.$set(this.form,"payerAccount","")
+          }else{
+            this.$set(this.form, "payerFrom", obj.parerFrom);
+            if(obj.operatorCode!=null&&obj.operatorCode!=''){
+              this.$set(this.form, "operatorCode", obj.operatorCode);
+            }else{
+              this.$set(this.form, "operatorCode", '');
+            }
+            if(obj.enterpriseCode!=null&&obj.enterpriseCode!=''){
+              this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+            }else{
+              this.$set(this.form, "enterpriseCode", '');
+            }
+            if(obj.accountPassword!=null&&obj.accountPassword!=''){
+              this.$set(this.form, "accountPassword", obj.accountPassword);
+            }else{
+              this.$set(this.form, "accountPassword", '');
+            }
+            this.$set(this.form, "bookId",'');
+            this.$set(this.form, "deptId", '');
+            this.$set(this.form, "cashierId", obj.id);
+            this.$set(this.form, "payer", obj.accountName);
+            if(obj.payerFrom==6){
+              getQmyeFlow(obj.bankAccountNumber).then((response) => {
+                this.$set(this.form, "payerAccount", response.data);
+              });
+            }else {
+              this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+            }
+          }
+        }
+      },
+      goBack(){
+        window.history.go(-1)
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+  }
+
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd2.vue

@@ -0,0 +1,764 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">添加付款申请</p>
+      </template>
+    </van-nav-bar>
+    <van-form @submit="getChange" @failed="getError" :show-error-message="false" scroll-to-error validate-first>
+      <p class="main_title">基础信息</p>
+      <div class="main_box">
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择申请时间'  }]"
+          v-model="form.applyDate"
+          label="申请时间"
+          placeholder="请选择申请时间"
+          @click="showlasj = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showlasj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmLasj"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择资金支出类别' }]"
+          label="资金支出类别"
+          placeholder="请选择"
+          v-model="capitalExpenditureType"
+          @click="showcapital = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showcapital" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="capitalExpenditureTypeOptions"
+            @confirm="onConfirmCapital"
+            @cancel="showcapital = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          required
+          label="支出总金额"
+          v-model="form.expenditureAmount"
+          placeholder="根据下方收款金额自动核算"
+          input-align="right"
+          label-width="auto"
+        />
+
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field
+          label="付款事由"
+          v-model="form.remark"
+          type="textarea"
+          placeholder="请输入付款事由"
+          input-align="right"
+          rows="3"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请输入付款事由' }]"
+        />
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field label="说明情况" v-model="form.explainSituation" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      </div>
+
+      <p class="main_title" v-if="capitalExpenditureOpen">关联项目</p>
+      <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
+        <van-field
+          readonly
+          clickable
+          label="项目名称"
+          placeholder="请选择"
+          v-model="projectForm.projectName"
+          @click="showproject = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择项目名称' }]"
+        />
+        <van-popup v-model="showproject" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectListShow"
+            @confirm="onConfirmProject"
+            @cancel="showproject = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入承建单位' }]" v-model="projectForm.projectContractor" label="承建单位" placeholder="请输入承建单位" input-align="right" label-width="auto"/>
+        <van-field required :rules="[{ required: true , message:'请输入合同价款' }]" v-model="projectForm.projectAmount" label="合同价款（元）" placeholder="请输入合同价款（元）" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          label="工程款类型"
+          placeholder="请选择"
+          v-model="projectFundType"
+          @click="showFundType = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择工程款类型' }]"
+        />
+        <van-popup v-model="showFundType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectFundTypeOptions"
+            @confirm="onConfirmFundType"
+            @cancel="showFundType = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入工程发票号' }]" v-model="projectForm.projectBillNum" label="工程发票号" placeholder="请输入工程发票号" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">付款方信息</p>
+      <div class="main_box">
+        <!--      <van-field label="付款方" v-model="form.payer" placeholder="请输入付款方" input-align="right" label-width="auto"/>-->
+        <van-field
+          readonly
+          clickable
+          label="付款方"
+          placeholder="请选择付款方"
+          v-model="form.payer"
+          @click="showpayer = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请选择付款方' }]"
+        />
+        <van-popup v-model="showpayer" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="payerOptions"
+            @confirm="onConfirmPayer($event)"
+            @cancel="showpayer = false"
+          />
+        </van-popup>
+        <van-field :rules="[{ required: true , message:'请输入付款方账户' }]" required label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">收款方信息<van-button icon="plus" @click="addChargeItme(chargeItme.length)" size="mini" type="info" native-type="button" class="addFamily"/></p>
+      <div class="main_box" style="margin-bottom: 15px;">
+        <van-cell title="收款账户类型">
+          <template #right-icon>
+            <van-radio-group direction="horizontal" v-model="form.accountType" @change="accountTypeChange">
+              <van-radio name="1">公户</van-radio>
+              <van-radio name="2">私户</van-radio>
+            </van-radio-group>
+          </template>
+        </van-cell>
+      </div>
+      <div :style="{position:'relative',padding: index == 0 ? '':'10px 0 0 0'}" v-for="(item, index) in chargeItme" :key="index">
+        <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteChargeItme(index)" />
+        <div class="main_box" style="margin-bottom: 10px;position:relative;">
+          <van-field
+            readonly
+            clickable
+            label="收款方"
+            placeholder="请选择"
+            v-model="item.payee"
+            @click="item.showPayee = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择收款方' }]"
+          />
+          <van-popup v-model="item.showPayee" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="payeeList"
+              @confirm="onConfirmPayee($event,index)"
+              @cancel="item.showPayee = false"
+            />
+          </van-popup>
+          <van-field required :rules="[{ required: true , message:'请输入账户' }]" v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入银行' }]" v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入金额' }]" v-model="item.incomeAmount" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto" @change="moneyChange"/>
+          <van-field
+            readonly
+            clickable
+            label="所属银行"
+            placeholder="请选择"
+            v-model="item.bankTypeText"
+            @click="item.showbankType = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择所属银行' }]"
+          />
+          <van-popup v-model="item.showbankType" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="bankTypeDictionaries"
+              @confirm="onConfirmBankType($event,index)"
+              @cancel="item.showbankType = false"
+            />
+          </van-popup>
+        </div>
+      </div>
+      <div style="padding: 16px 0;">
+        <van-row>
+          <van-col span="12" align="center">
+<!--            @click="goUpdate"-->
+            <van-button type="info" native-type="submit" @click="buttonType='update'" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
+          </van-col>
+          <van-col span="12" align="center">
+<!--            @click="goAdd"-->
+            <van-button type="info" native-type="submit" @click="buttonType='add'" class="submitButton">保存并提交</van-button>
+          </van-col>
+        </van-row>
+        <div class="clear"></div>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script>
+  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount ,getQmyeFlow} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  export default {
+    name: "approvalAdd2",
+    data() {
+      return {
+        showcapital:false,
+        showpayee:false,
+        showlasj:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
+        showpayer:false,
+
+        buttonType:'a',
+
+        minDate: new Date(),
+        maxDate: new Date(2050, 10, 1),
+        currentDate: new Date(),
+        form:{},
+
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
+
+        wfydlxDictionaries:[],
+        jglxDictionaries:[],
+        sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
+        payerOptions:[],
+
+        chargeItme:[],
+        chargeItmeShow:[],
+
+        payeeList:[],
+        // 查询参数
+        queryParams: {
+          transferType:"",
+          orderByColumn: "id",
+          isAsc: "desc",
+        },
+        capitalExpenditureOpen:false,
+        projectForm:{
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        },
+        projectFundType:''
+      };
+    },
+    created() {
+      this.reset();
+      let queryParams={
+        pageNum: 1,
+        pageSize: 100,
+      }
+      listProject(queryParams).then(response => {
+        this.projectList = response.rows;
+        for (var i = 0; i < response.rows.length; i++) {
+          this.projectListShow.push({text: response.rows[i].projectName, value: response.rows[i].id});
+        }
+      });
+      this.getDicts("project_fund_type").then((response) => {
+        for (var i = 0; i < response.data.length; i++) {
+          this.projectFundTypeOptions.push({text: response.data[i].dictLabel, value: response.data[i].dictValue});
+        }
+        this.projectFundTypeDictionaries = response.data;
+      });
+      let params1={
+        accountType: "102",
+        status: "N",
+      }
+      getAccount(params1).then((response) => {
+        this.payerOptions = response.rows;
+        response.rows.map((res,index) => {
+          res['payerFrom'] = '1'
+          console.log(res)
+          this.payerOptions[index].text = res.accountName;
+          this.payerOptions[index].value = res.id;
+        })
+      });
+      this.getDictionaries();
+    },
+    methods: {
+      // 表单重置
+      reset() {
+        this.form = {
+          id: null,
+          upId: null,
+          downId: null,
+          orderId: null,
+          cashierId: null,
+          transferType: '1',
+          accountType: '2',
+          explainSituation: null,
+          succeedAmount: null,
+          payer: null,
+          payerAccount: null,
+          operatorCode: null,
+          enterpriseCode: null,
+          expenditureAmount: null,
+          capitalExpenditureType: '1',
+          remark: null,
+          transferStatus: "0",
+          auditStatus: "0",
+          paymentState: "1",
+          bankPriority: "0",
+          clientPriority: "0"
+        };
+        this.processList = {}
+        this.projectForm={
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        }
+      },
+      getChange(){
+        console.log(this.buttonType)
+        if(this.buttonType == 'update'){
+          console.log('update')
+          this.goUpdate();
+        }else if(this.buttonType == 'add'){
+          console.log('add')
+          this.goAdd();
+        }
+      },
+      getDictionaries(){
+        this.getDicts("capital_expenditure_type").then((res) => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.capitalExpenditureTypeOptions.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getDicts("bank_type").then(res => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.bankTypeDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getPayeeList();
+      },
+      getError(e){
+        console.log(e)
+        this.$notify({ type: 'danger', message: e.errors[0].message });
+      },
+      addChargeItme(index){
+        if(this.chargeItme.length>0&&this.chargeItme[this.chargeItme.length-1].payee == ''){
+          this.$notify({ type: 'danger', message: '请勿添加多个空列表信息' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].incomeAmount == ''){
+          this.$notify({ type: 'danger', message: '请输入收入金额！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].payeeAccount == ''){
+          this.$notify({ type: 'danger', message: '请输入收款账户！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankDeposit == ''){
+          this.$notify({ type: 'danger', message: '请输入开户银行！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankType == ''){
+          this.$notify({ type: 'danger', message: '请选择所属银行！' });
+          return;
+        }
+        this.getDicts("bank_type").then(res => {
+          this.chargeItme.splice(index + 1, 0, {
+            payeeId: "", //收款方ID
+            payee: "", //收款方
+            payeeAccount: "", //收款账户
+            bankDeposit: "", //开户银行
+            incomeAmount: "", //收入金额
+            bankType: "1", //所属银行
+            bankTypeText:this.selectDictLabel(res.data, 1), //所属银行
+            showPayee:false,
+            showbankType:false
+          });
+        });
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      payeeDictLabel(datas, value) {
+        var actions = [];
+        Object.keys(datas).some((key) => {
+          if (datas[key].payeeId == ('' + value)) {
+            actions.push(datas[key].payee);
+            return true;
+          }
+        })
+        return actions.join('');
+      },
+      onConfirmCapital(data){
+        if (data.value != 2){
+          this.capitalExpenditureOpen = false;
+          this.projectForm = [];
+        }else{
+          this.capitalExpenditureOpen = true;
+        }
+        this.capitalExpenditureType = data.text;
+        this.form.capitalExpenditureType = data.value;
+        this.showcapital = false;
+      },
+      onConfirmFundType(data){
+        console.log(data)
+        this.projectForm.projectFundType = data.value;
+        this.projectFundType = data.text;
+        this.showFundType = false;
+      },
+      onConfirmProject(data){
+        this.projectList.map(res => {
+          if(res.projectName==data.text){
+            this.projectForm.projectId = res.id
+            this.projectForm.projectName = res.projectName
+            this.projectForm.projectContractor = res.projectContractor
+            this.projectForm.projectAmount = res.projectAmount
+          }
+        })
+        this.showproject = false;
+      },
+      onConfirmPayee(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showPayee = false;
+        }
+        this.chargeItme[index].payee = data.text;
+        this.chargeItme[index].payeeId = data.value;
+        this.chargeItme[index].showpayee = false;
+        this.payeeSelectChange(data.value , index)
+      },
+      onConfirmBankType(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showbankType = false;
+        }
+        this.chargeItme[index].bankTypeText = data.text;
+        this.chargeItme[index].bankType = data.value;
+        this.chargeItme[index].showbankType = false;
+      },
+      onConfirmPayer(data){
+        this.form.payer = data.text;
+        this.form.cashierId = data.value;
+        this.showpayer = false;
+        this.selectChange(data.value)
+      },
+      onConfirmLasj(data){
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
+        this.showlasj = false;
+      },
+      accountTypeChange(e){
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      // 钱计算
+      moneyChange(input) {
+        console.log(input)
+        let obj = {};
+        obj = this.chargeItme.find((account) => {
+          //model就是上面的数据源
+          return parseFloat(account.incomeAmount).toFixed(2) === input; //筛选出匹配数据
+        });
+        let total = 0;
+        this.chargeItme.forEach((money) => {
+          total = (parseFloat(total) + parseFloat(money.incomeAmount)).toFixed(2)
+        });
+        this.$set(this.form, "expenditureAmount", total);
+      },
+      goAdd(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        addTransfer(this.form).then(response => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              customSubmit(response.data.id).then(res => {
+                this.$toast.success('提交成功');
+                setTimeout(function(){
+                  history.go(-1)
+                },2000)
+              })
+            })
+          }else{
+            customSubmit(response.data.id).then(res => {
+              this.$toast.success('提交成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }
+        });
+      },
+      goUpdate(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        this.projectForm.outId = this.form.id
+        addTransfer(this.form).then((response) => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              this.$toast.success('保存成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }else{
+            this.$toast.success('保存成功');
+            setTimeout(function(){
+              history.go(-1)
+            },2000)
+          }
+        });
+      },
+      payeeSelectChange(select, i) {
+        let obj = {};
+        let fuzhitype = 0;
+        obj = this.payeeList.find((account) => {
+          //model就是上面的数据源
+          return account.id === select ; //筛选出匹配数据
+        });
+        if(this.chargeItme != [] && this.chargeItme.length>1){
+          this.chargeItme.some((value, index) => {
+            if(value.payeeAccount != undefined &&value.payeeAccount != '' && obj.payeeAccount == value.payeeAccount&&index!=i){
+              fuzhitype = 2;
+              return true;
+            }
+            if(value.accountType != undefined &&value.accountType != '' && obj.accountType != value.accountType&&index!=i){
+              fuzhitype = 1;
+              return true;
+            }
+          });
+        }
+        if(fuzhitype == 0){
+          this.$set(this.chargeItme[i], "payee",obj.payee)
+          this.$set(this.chargeItme[i], "bankType", obj.bankType)
+          this.$set(this.chargeItme[i], "payeeId", obj.id);
+          this.$set(this.chargeItme[i], "payeeAccount", obj.payeeAccount);
+          this.$set(this.chargeItme[i], "bankDeposit", obj.bankDeposit);
+          this.$set(this.chargeItme[i], "accountType", obj.accountType);
+        }else if(fuzhitype == 1){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '请选择账户类型相同的收款方！' });
+        }else if(fuzhitype == 2){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '收款方已存在！' });
+        }
+      },
+      selectChange(select) {
+        let obj = {};
+        obj = this.payerOptions.find((account) => {
+          //model就是上面的数据源
+          return account.id === select; //筛选出匹配数据
+        });
+        if(obj.payerFrom==1&&obj.operatorCode != null && obj.operatorCode != "" &&
+          obj.enterpriseCode != null && obj.enterpriseCode != "" &&
+          obj.accountPassword != null && obj.accountPassword != ""){
+          this.$set(this.form, "bookId", obj.bookId);
+          this.$set(this.form, "deptId", obj.deptId);
+          this.$set(this.form, "cashierId", obj.id);
+          this.$set(this.form, "payer", obj.accountName);
+          this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+          this.$set(this.form, "operatorCode", obj.operatorCode);
+          this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+          this.$set(this.form, "payerFrom", '1');
+        }else{
+          if(obj.payerFrom==1){
+            this.diglogStatus = false;
+            this.$notify({ type: 'danger', message: "请完善付款方“操作员代码”、“企业编码”、“支付口令”等信息！" });
+            this.$set(this.form,"payer","")
+            this.$set(this.form,"payerAccount","")
+          }else{
+            this.$set(this.form, "payerFrom", obj.parerFrom);
+            if(obj.operatorCode!=null&&obj.operatorCode!=''){
+              this.$set(this.form, "operatorCode", obj.operatorCode);
+            }else{
+              this.$set(this.form, "operatorCode", '');
+            }
+            if(obj.enterpriseCode!=null&&obj.enterpriseCode!=''){
+              this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+            }else{
+              this.$set(this.form, "enterpriseCode", '');
+            }
+            if(obj.accountPassword!=null&&obj.accountPassword!=''){
+              this.$set(this.form, "accountPassword", obj.accountPassword);
+            }else{
+              this.$set(this.form, "accountPassword", '');
+            }
+            this.$set(this.form, "bookId",'');
+            this.$set(this.form, "deptId", '');
+            this.$set(this.form, "cashierId", obj.id);
+            this.$set(this.form, "payer", obj.accountName);
+            if(obj.payerFrom==6){
+              getQmyeFlow(obj.bankAccountNumber).then((response) => {
+                this.$set(this.form, "payerAccount", response.data);
+              });
+            }else {
+              this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+            }
+          }
+        }
+      },
+      goBack(){
+        window.history.go(-1)
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+  }
+
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd3.vue

@@ -0,0 +1,764 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">添加付款申请</p>
+      </template>
+    </van-nav-bar>
+    <van-form @submit="getChange" @failed="getError" :show-error-message="false" scroll-to-error validate-first>
+      <p class="main_title">基础信息</p>
+      <div class="main_box">
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择申请时间'  }]"
+          v-model="form.applyDate"
+          label="申请时间"
+          placeholder="请选择申请时间"
+          @click="showlasj = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showlasj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmLasj"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择资金支出类别' }]"
+          label="资金支出类别"
+          placeholder="请选择"
+          v-model="capitalExpenditureType"
+          @click="showcapital = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showcapital" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="capitalExpenditureTypeOptions"
+            @confirm="onConfirmCapital"
+            @cancel="showcapital = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          required
+          label="支出总金额"
+          v-model="form.expenditureAmount"
+          placeholder="根据下方收款金额自动核算"
+          input-align="right"
+          label-width="auto"
+        />
+
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field
+          label="付款事由"
+          v-model="form.remark"
+          type="textarea"
+          placeholder="请输入付款事由"
+          input-align="right"
+          rows="3"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请输入付款事由' }]"
+        />
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field label="说明情况" v-model="form.explainSituation" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      </div>
+
+      <p class="main_title" v-if="capitalExpenditureOpen">关联项目</p>
+      <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
+        <van-field
+          readonly
+          clickable
+          label="项目名称"
+          placeholder="请选择"
+          v-model="projectForm.projectName"
+          @click="showproject = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择项目名称' }]"
+        />
+        <van-popup v-model="showproject" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectListShow"
+            @confirm="onConfirmProject"
+            @cancel="showproject = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入承建单位' }]" v-model="projectForm.projectContractor" label="承建单位" placeholder="请输入承建单位" input-align="right" label-width="auto"/>
+        <van-field required :rules="[{ required: true , message:'请输入合同价款' }]" v-model="projectForm.projectAmount" label="合同价款（元）" placeholder="请输入合同价款（元）" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          label="工程款类型"
+          placeholder="请选择"
+          v-model="projectFundType"
+          @click="showFundType = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择工程款类型' }]"
+        />
+        <van-popup v-model="showFundType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectFundTypeOptions"
+            @confirm="onConfirmFundType"
+            @cancel="showFundType = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入工程发票号' }]" v-model="projectForm.projectBillNum" label="工程发票号" placeholder="请输入工程发票号" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">付款方信息</p>
+      <div class="main_box">
+        <!--      <van-field label="付款方" v-model="form.payer" placeholder="请输入付款方" input-align="right" label-width="auto"/>-->
+        <van-field
+          readonly
+          clickable
+          label="付款方"
+          placeholder="请选择付款方"
+          v-model="form.payer"
+          @click="showpayer = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请选择付款方' }]"
+        />
+        <van-popup v-model="showpayer" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="payerOptions"
+            @confirm="onConfirmPayer($event)"
+            @cancel="showpayer = false"
+          />
+        </van-popup>
+        <van-field :rules="[{ required: true , message:'请输入付款方账户' }]" required label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">收款方信息<van-button icon="plus" @click="addChargeItme(chargeItme.length)" size="mini" type="info" native-type="button" class="addFamily"/></p>
+      <div class="main_box" style="margin-bottom: 15px;">
+        <van-cell title="收款账户类型">
+          <template #right-icon>
+            <van-radio-group direction="horizontal" v-model="form.accountType" @change="accountTypeChange">
+              <van-radio name="1">公户</van-radio>
+              <van-radio name="2">私户</van-radio>
+            </van-radio-group>
+          </template>
+        </van-cell>
+      </div>
+      <div :style="{position:'relative',padding: index == 0 ? '':'10px 0 0 0'}" v-for="(item, index) in chargeItme" :key="index">
+        <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteChargeItme(index)" />
+        <div class="main_box" style="margin-bottom: 10px;position:relative;">
+          <van-field
+            readonly
+            clickable
+            label="收款方"
+            placeholder="请选择"
+            v-model="item.payee"
+            @click="item.showPayee = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择收款方' }]"
+          />
+          <van-popup v-model="item.showPayee" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="payeeList"
+              @confirm="onConfirmPayee($event,index)"
+              @cancel="item.showPayee = false"
+            />
+          </van-popup>
+          <van-field required :rules="[{ required: true , message:'请输入账户' }]" v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入银行' }]" v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入金额' }]" v-model="item.incomeAmount" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto" @change="moneyChange"/>
+          <van-field
+            readonly
+            clickable
+            label="所属银行"
+            placeholder="请选择"
+            v-model="item.bankTypeText"
+            @click="item.showbankType = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择所属银行' }]"
+          />
+          <van-popup v-model="item.showbankType" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="bankTypeDictionaries"
+              @confirm="onConfirmBankType($event,index)"
+              @cancel="item.showbankType = false"
+            />
+          </van-popup>
+        </div>
+      </div>
+      <div style="padding: 16px 0;">
+        <van-row>
+          <van-col span="12" align="center">
+<!--            @click="goUpdate"-->
+            <van-button type="info" native-type="submit" @click="buttonType='update'" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
+          </van-col>
+          <van-col span="12" align="center">
+<!--            @click="goAdd"-->
+            <van-button type="info" native-type="submit" @click="buttonType='add'" class="submitButton">保存并提交</van-button>
+          </van-col>
+        </van-row>
+        <div class="clear"></div>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script>
+  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount ,getQmyeFlow} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  export default {
+    name: "approvalAdd3",
+    data() {
+      return {
+        showcapital:false,
+        showpayee:false,
+        showlasj:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
+        showpayer:false,
+
+        buttonType:'a',
+
+        minDate: new Date(),
+        maxDate: new Date(2050, 10, 1),
+        currentDate: new Date(),
+        form:{},
+
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
+
+        wfydlxDictionaries:[],
+        jglxDictionaries:[],
+        sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
+        payerOptions:[],
+
+        chargeItme:[],
+        chargeItmeShow:[],
+
+        payeeList:[],
+        // 查询参数
+        queryParams: {
+          transferType:"",
+          orderByColumn: "id",
+          isAsc: "desc",
+        },
+        capitalExpenditureOpen:false,
+        projectForm:{
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        },
+        projectFundType:''
+      };
+    },
+    created() {
+      this.reset();
+      let queryParams={
+        pageNum: 1,
+        pageSize: 100,
+      }
+      listProject(queryParams).then(response => {
+        this.projectList = response.rows;
+        for (var i = 0; i < response.rows.length; i++) {
+          this.projectListShow.push({text: response.rows[i].projectName, value: response.rows[i].id});
+        }
+      });
+      this.getDicts("project_fund_type").then((response) => {
+        for (var i = 0; i < response.data.length; i++) {
+          this.projectFundTypeOptions.push({text: response.data[i].dictLabel, value: response.data[i].dictValue});
+        }
+        this.projectFundTypeDictionaries = response.data;
+      });
+      let params1={
+        accountType: "102",
+        status: "N",
+      }
+      getAccount(params1).then((response) => {
+        this.payerOptions = response.rows;
+        response.rows.map((res,index) => {
+          res['payerFrom'] = '1'
+          console.log(res)
+          this.payerOptions[index].text = res.accountName;
+          this.payerOptions[index].value = res.id;
+        })
+      });
+      this.getDictionaries();
+    },
+    methods: {
+      // 表单重置
+      reset() {
+        this.form = {
+          id: null,
+          upId: null,
+          downId: null,
+          orderId: null,
+          cashierId: null,
+          transferType: '1',
+          accountType: '2',
+          explainSituation: null,
+          succeedAmount: null,
+          payer: null,
+          payerAccount: null,
+          operatorCode: null,
+          enterpriseCode: null,
+          expenditureAmount: null,
+          capitalExpenditureType: '1',
+          remark: null,
+          transferStatus: "0",
+          auditStatus: "0",
+          paymentState: "1",
+          bankPriority: "0",
+          clientPriority: "0"
+        };
+        this.processList = {}
+        this.projectForm={
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        }
+      },
+      getChange(){
+        console.log(this.buttonType)
+        if(this.buttonType == 'update'){
+          console.log('update')
+          this.goUpdate();
+        }else if(this.buttonType == 'add'){
+          console.log('add')
+          this.goAdd();
+        }
+      },
+      getDictionaries(){
+        this.getDicts("capital_expenditure_type").then((res) => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.capitalExpenditureTypeOptions.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getDicts("bank_type").then(res => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.bankTypeDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getPayeeList();
+      },
+      getError(e){
+        console.log(e)
+        this.$notify({ type: 'danger', message: e.errors[0].message });
+      },
+      addChargeItme(index){
+        if(this.chargeItme.length>0&&this.chargeItme[this.chargeItme.length-1].payee == ''){
+          this.$notify({ type: 'danger', message: '请勿添加多个空列表信息' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].incomeAmount == ''){
+          this.$notify({ type: 'danger', message: '请输入收入金额！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].payeeAccount == ''){
+          this.$notify({ type: 'danger', message: '请输入收款账户！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankDeposit == ''){
+          this.$notify({ type: 'danger', message: '请输入开户银行！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankType == ''){
+          this.$notify({ type: 'danger', message: '请选择所属银行！' });
+          return;
+        }
+        this.getDicts("bank_type").then(res => {
+          this.chargeItme.splice(index + 1, 0, {
+            payeeId: "", //收款方ID
+            payee: "", //收款方
+            payeeAccount: "", //收款账户
+            bankDeposit: "", //开户银行
+            incomeAmount: "", //收入金额
+            bankType: "1", //所属银行
+            bankTypeText:this.selectDictLabel(res.data, 1), //所属银行
+            showPayee:false,
+            showbankType:false
+          });
+        });
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      payeeDictLabel(datas, value) {
+        var actions = [];
+        Object.keys(datas).some((key) => {
+          if (datas[key].payeeId == ('' + value)) {
+            actions.push(datas[key].payee);
+            return true;
+          }
+        })
+        return actions.join('');
+      },
+      onConfirmCapital(data){
+        if (data.value != 2){
+          this.capitalExpenditureOpen = false;
+          this.projectForm = [];
+        }else{
+          this.capitalExpenditureOpen = true;
+        }
+        this.capitalExpenditureType = data.text;
+        this.form.capitalExpenditureType = data.value;
+        this.showcapital = false;
+      },
+      onConfirmFundType(data){
+        console.log(data)
+        this.projectForm.projectFundType = data.value;
+        this.projectFundType = data.text;
+        this.showFundType = false;
+      },
+      onConfirmProject(data){
+        this.projectList.map(res => {
+          if(res.projectName==data.text){
+            this.projectForm.projectId = res.id
+            this.projectForm.projectName = res.projectName
+            this.projectForm.projectContractor = res.projectContractor
+            this.projectForm.projectAmount = res.projectAmount
+          }
+        })
+        this.showproject = false;
+      },
+      onConfirmPayee(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showPayee = false;
+        }
+        this.chargeItme[index].payee = data.text;
+        this.chargeItme[index].payeeId = data.value;
+        this.chargeItme[index].showpayee = false;
+        this.payeeSelectChange(data.value , index)
+      },
+      onConfirmBankType(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showbankType = false;
+        }
+        this.chargeItme[index].bankTypeText = data.text;
+        this.chargeItme[index].bankType = data.value;
+        this.chargeItme[index].showbankType = false;
+      },
+      onConfirmPayer(data){
+        this.form.payer = data.text;
+        this.form.cashierId = data.value;
+        this.showpayer = false;
+        this.selectChange(data.value)
+      },
+      onConfirmLasj(data){
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
+        this.showlasj = false;
+      },
+      accountTypeChange(e){
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      // 钱计算
+      moneyChange(input) {
+        console.log(input)
+        let obj = {};
+        obj = this.chargeItme.find((account) => {
+          //model就是上面的数据源
+          return parseFloat(account.incomeAmount).toFixed(2) === input; //筛选出匹配数据
+        });
+        let total = 0;
+        this.chargeItme.forEach((money) => {
+          total = (parseFloat(total) + parseFloat(money.incomeAmount)).toFixed(2)
+        });
+        this.$set(this.form, "expenditureAmount", total);
+      },
+      goAdd(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        addTransfer(this.form).then(response => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              customSubmit(response.data.id).then(res => {
+                this.$toast.success('提交成功');
+                setTimeout(function(){
+                  history.go(-1)
+                },2000)
+              })
+            })
+          }else{
+            customSubmit(response.data.id).then(res => {
+              this.$toast.success('提交成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }
+        });
+      },
+      goUpdate(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        this.projectForm.outId = this.form.id
+        addTransfer(this.form).then((response) => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              this.$toast.success('保存成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }else{
+            this.$toast.success('保存成功');
+            setTimeout(function(){
+              history.go(-1)
+            },2000)
+          }
+        });
+      },
+      payeeSelectChange(select, i) {
+        let obj = {};
+        let fuzhitype = 0;
+        obj = this.payeeList.find((account) => {
+          //model就是上面的数据源
+          return account.id === select ; //筛选出匹配数据
+        });
+        if(this.chargeItme != [] && this.chargeItme.length>1){
+          this.chargeItme.some((value, index) => {
+            if(value.payeeAccount != undefined &&value.payeeAccount != '' && obj.payeeAccount == value.payeeAccount&&index!=i){
+              fuzhitype = 2;
+              return true;
+            }
+            if(value.accountType != undefined &&value.accountType != '' && obj.accountType != value.accountType&&index!=i){
+              fuzhitype = 1;
+              return true;
+            }
+          });
+        }
+        if(fuzhitype == 0){
+          this.$set(this.chargeItme[i], "payee",obj.payee)
+          this.$set(this.chargeItme[i], "bankType", obj.bankType)
+          this.$set(this.chargeItme[i], "payeeId", obj.id);
+          this.$set(this.chargeItme[i], "payeeAccount", obj.payeeAccount);
+          this.$set(this.chargeItme[i], "bankDeposit", obj.bankDeposit);
+          this.$set(this.chargeItme[i], "accountType", obj.accountType);
+        }else if(fuzhitype == 1){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '请选择账户类型相同的收款方！' });
+        }else if(fuzhitype == 2){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '收款方已存在！' });
+        }
+      },
+      selectChange(select) {
+        let obj = {};
+        obj = this.payerOptions.find((account) => {
+          //model就是上面的数据源
+          return account.id === select; //筛选出匹配数据
+        });
+        if(obj.payerFrom==1&&obj.operatorCode != null && obj.operatorCode != "" &&
+          obj.enterpriseCode != null && obj.enterpriseCode != "" &&
+          obj.accountPassword != null && obj.accountPassword != ""){
+          this.$set(this.form, "bookId", obj.bookId);
+          this.$set(this.form, "deptId", obj.deptId);
+          this.$set(this.form, "cashierId", obj.id);
+          this.$set(this.form, "payer", obj.accountName);
+          this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+          this.$set(this.form, "operatorCode", obj.operatorCode);
+          this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+          this.$set(this.form, "payerFrom", '1');
+        }else{
+          if(obj.payerFrom==1){
+            this.diglogStatus = false;
+            this.$notify({ type: 'danger', message: "请完善付款方“操作员代码”、“企业编码”、“支付口令”等信息！" });
+            this.$set(this.form,"payer","")
+            this.$set(this.form,"payerAccount","")
+          }else{
+            this.$set(this.form, "payerFrom", obj.parerFrom);
+            if(obj.operatorCode!=null&&obj.operatorCode!=''){
+              this.$set(this.form, "operatorCode", obj.operatorCode);
+            }else{
+              this.$set(this.form, "operatorCode", '');
+            }
+            if(obj.enterpriseCode!=null&&obj.enterpriseCode!=''){
+              this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+            }else{
+              this.$set(this.form, "enterpriseCode", '');
+            }
+            if(obj.accountPassword!=null&&obj.accountPassword!=''){
+              this.$set(this.form, "accountPassword", obj.accountPassword);
+            }else{
+              this.$set(this.form, "accountPassword", '');
+            }
+            this.$set(this.form, "bookId",'');
+            this.$set(this.form, "deptId", '');
+            this.$set(this.form, "cashierId", obj.id);
+            this.$set(this.form, "payer", obj.accountName);
+            if(obj.payerFrom==6){
+              getQmyeFlow(obj.bankAccountNumber).then((response) => {
+                this.$set(this.form, "payerAccount", response.data);
+              });
+            }else {
+              this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+            }
+          }
+        }
+      },
+      goBack(){
+        window.history.go(-1)
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+  }
+
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd4.vue

@@ -0,0 +1,764 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">添加付款申请</p>
+      </template>
+    </van-nav-bar>
+    <van-form @submit="getChange" @failed="getError" :show-error-message="false" scroll-to-error validate-first>
+      <p class="main_title">基础信息</p>
+      <div class="main_box">
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择申请时间'  }]"
+          v-model="form.applyDate"
+          label="申请时间"
+          placeholder="请选择申请时间"
+          @click="showlasj = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showlasj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmLasj"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择资金支出类别' }]"
+          label="资金支出类别"
+          placeholder="请选择"
+          v-model="capitalExpenditureType"
+          @click="showcapital = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showcapital" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="capitalExpenditureTypeOptions"
+            @confirm="onConfirmCapital"
+            @cancel="showcapital = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          required
+          label="支出总金额"
+          v-model="form.expenditureAmount"
+          placeholder="根据下方收款金额自动核算"
+          input-align="right"
+          label-width="auto"
+        />
+
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field
+          label="付款事由"
+          v-model="form.remark"
+          type="textarea"
+          placeholder="请输入付款事由"
+          input-align="right"
+          rows="3"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请输入付款事由' }]"
+        />
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field label="说明情况" v-model="form.explainSituation" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      </div>
+
+      <p class="main_title" v-if="capitalExpenditureOpen">关联项目</p>
+      <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
+        <van-field
+          readonly
+          clickable
+          label="项目名称"
+          placeholder="请选择"
+          v-model="projectForm.projectName"
+          @click="showproject = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择项目名称' }]"
+        />
+        <van-popup v-model="showproject" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectListShow"
+            @confirm="onConfirmProject"
+            @cancel="showproject = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入承建单位' }]" v-model="projectForm.projectContractor" label="承建单位" placeholder="请输入承建单位" input-align="right" label-width="auto"/>
+        <van-field required :rules="[{ required: true , message:'请输入合同价款' }]" v-model="projectForm.projectAmount" label="合同价款（元）" placeholder="请输入合同价款（元）" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          label="工程款类型"
+          placeholder="请选择"
+          v-model="projectFundType"
+          @click="showFundType = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择工程款类型' }]"
+        />
+        <van-popup v-model="showFundType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectFundTypeOptions"
+            @confirm="onConfirmFundType"
+            @cancel="showFundType = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入工程发票号' }]" v-model="projectForm.projectBillNum" label="工程发票号" placeholder="请输入工程发票号" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">付款方信息</p>
+      <div class="main_box">
+        <!--      <van-field label="付款方" v-model="form.payer" placeholder="请输入付款方" input-align="right" label-width="auto"/>-->
+        <van-field
+          readonly
+          clickable
+          label="付款方"
+          placeholder="请选择付款方"
+          v-model="form.payer"
+          @click="showpayer = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请选择付款方' }]"
+        />
+        <van-popup v-model="showpayer" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="payerOptions"
+            @confirm="onConfirmPayer($event)"
+            @cancel="showpayer = false"
+          />
+        </van-popup>
+        <van-field :rules="[{ required: true , message:'请输入付款方账户' }]" required label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">收款方信息<van-button icon="plus" @click="addChargeItme(chargeItme.length)" size="mini" type="info" native-type="button" class="addFamily"/></p>
+      <div class="main_box" style="margin-bottom: 15px;">
+        <van-cell title="收款账户类型">
+          <template #right-icon>
+            <van-radio-group direction="horizontal" v-model="form.accountType" @change="accountTypeChange">
+              <van-radio name="1">公户</van-radio>
+              <van-radio name="2">私户</van-radio>
+            </van-radio-group>
+          </template>
+        </van-cell>
+      </div>
+      <div :style="{position:'relative',padding: index == 0 ? '':'10px 0 0 0'}" v-for="(item, index) in chargeItme" :key="index">
+        <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteChargeItme(index)" />
+        <div class="main_box" style="margin-bottom: 10px;position:relative;">
+          <van-field
+            readonly
+            clickable
+            label="收款方"
+            placeholder="请选择"
+            v-model="item.payee"
+            @click="item.showPayee = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择收款方' }]"
+          />
+          <van-popup v-model="item.showPayee" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="payeeList"
+              @confirm="onConfirmPayee($event,index)"
+              @cancel="item.showPayee = false"
+            />
+          </van-popup>
+          <van-field required :rules="[{ required: true , message:'请输入账户' }]" v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入银行' }]" v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入金额' }]" v-model="item.incomeAmount" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto" @change="moneyChange"/>
+          <van-field
+            readonly
+            clickable
+            label="所属银行"
+            placeholder="请选择"
+            v-model="item.bankTypeText"
+            @click="item.showbankType = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择所属银行' }]"
+          />
+          <van-popup v-model="item.showbankType" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="bankTypeDictionaries"
+              @confirm="onConfirmBankType($event,index)"
+              @cancel="item.showbankType = false"
+            />
+          </van-popup>
+        </div>
+      </div>
+      <div style="padding: 16px 0;">
+        <van-row>
+          <van-col span="12" align="center">
+<!--            @click="goUpdate"-->
+            <van-button type="info" native-type="submit" @click="buttonType='update'" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
+          </van-col>
+          <van-col span="12" align="center">
+<!--            @click="goAdd"-->
+            <van-button type="info" native-type="submit" @click="buttonType='add'" class="submitButton">保存并提交</van-button>
+          </van-col>
+        </van-row>
+        <div class="clear"></div>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script>
+  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount ,getQmyeFlow} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  export default {
+    name: "approvalAdd4",
+    data() {
+      return {
+        showcapital:false,
+        showpayee:false,
+        showlasj:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
+        showpayer:false,
+
+        buttonType:'a',
+
+        minDate: new Date(),
+        maxDate: new Date(2050, 10, 1),
+        currentDate: new Date(),
+        form:{},
+
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
+
+        wfydlxDictionaries:[],
+        jglxDictionaries:[],
+        sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
+        payerOptions:[],
+
+        chargeItme:[],
+        chargeItmeShow:[],
+
+        payeeList:[],
+        // 查询参数
+        queryParams: {
+          transferType:"",
+          orderByColumn: "id",
+          isAsc: "desc",
+        },
+        capitalExpenditureOpen:false,
+        projectForm:{
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        },
+        projectFundType:''
+      };
+    },
+    created() {
+      this.reset();
+      let queryParams={
+        pageNum: 1,
+        pageSize: 100,
+      }
+      listProject(queryParams).then(response => {
+        this.projectList = response.rows;
+        for (var i = 0; i < response.rows.length; i++) {
+          this.projectListShow.push({text: response.rows[i].projectName, value: response.rows[i].id});
+        }
+      });
+      this.getDicts("project_fund_type").then((response) => {
+        for (var i = 0; i < response.data.length; i++) {
+          this.projectFundTypeOptions.push({text: response.data[i].dictLabel, value: response.data[i].dictValue});
+        }
+        this.projectFundTypeDictionaries = response.data;
+      });
+      let params1={
+        accountType: "102",
+        status: "N",
+      }
+      getAccount(params1).then((response) => {
+        this.payerOptions = response.rows;
+        response.rows.map((res,index) => {
+          res['payerFrom'] = '1'
+          console.log(res)
+          this.payerOptions[index].text = res.accountName;
+          this.payerOptions[index].value = res.id;
+        })
+      });
+      this.getDictionaries();
+    },
+    methods: {
+      // 表单重置
+      reset() {
+        this.form = {
+          id: null,
+          upId: null,
+          downId: null,
+          orderId: null,
+          cashierId: null,
+          transferType: '1',
+          accountType: '2',
+          explainSituation: null,
+          succeedAmount: null,
+          payer: null,
+          payerAccount: null,
+          operatorCode: null,
+          enterpriseCode: null,
+          expenditureAmount: null,
+          capitalExpenditureType: '1',
+          remark: null,
+          transferStatus: "0",
+          auditStatus: "0",
+          paymentState: "1",
+          bankPriority: "0",
+          clientPriority: "0"
+        };
+        this.processList = {}
+        this.projectForm={
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        }
+      },
+      getChange(){
+        console.log(this.buttonType)
+        if(this.buttonType == 'update'){
+          console.log('update')
+          this.goUpdate();
+        }else if(this.buttonType == 'add'){
+          console.log('add')
+          this.goAdd();
+        }
+      },
+      getDictionaries(){
+        this.getDicts("capital_expenditure_type").then((res) => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.capitalExpenditureTypeOptions.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getDicts("bank_type").then(res => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.bankTypeDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getPayeeList();
+      },
+      getError(e){
+        console.log(e)
+        this.$notify({ type: 'danger', message: e.errors[0].message });
+      },
+      addChargeItme(index){
+        if(this.chargeItme.length>0&&this.chargeItme[this.chargeItme.length-1].payee == ''){
+          this.$notify({ type: 'danger', message: '请勿添加多个空列表信息' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].incomeAmount == ''){
+          this.$notify({ type: 'danger', message: '请输入收入金额！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].payeeAccount == ''){
+          this.$notify({ type: 'danger', message: '请输入收款账户！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankDeposit == ''){
+          this.$notify({ type: 'danger', message: '请输入开户银行！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankType == ''){
+          this.$notify({ type: 'danger', message: '请选择所属银行！' });
+          return;
+        }
+        this.getDicts("bank_type").then(res => {
+          this.chargeItme.splice(index + 1, 0, {
+            payeeId: "", //收款方ID
+            payee: "", //收款方
+            payeeAccount: "", //收款账户
+            bankDeposit: "", //开户银行
+            incomeAmount: "", //收入金额
+            bankType: "1", //所属银行
+            bankTypeText:this.selectDictLabel(res.data, 1), //所属银行
+            showPayee:false,
+            showbankType:false
+          });
+        });
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      payeeDictLabel(datas, value) {
+        var actions = [];
+        Object.keys(datas).some((key) => {
+          if (datas[key].payeeId == ('' + value)) {
+            actions.push(datas[key].payee);
+            return true;
+          }
+        })
+        return actions.join('');
+      },
+      onConfirmCapital(data){
+        if (data.value != 2){
+          this.capitalExpenditureOpen = false;
+          this.projectForm = [];
+        }else{
+          this.capitalExpenditureOpen = true;
+        }
+        this.capitalExpenditureType = data.text;
+        this.form.capitalExpenditureType = data.value;
+        this.showcapital = false;
+      },
+      onConfirmFundType(data){
+        console.log(data)
+        this.projectForm.projectFundType = data.value;
+        this.projectFundType = data.text;
+        this.showFundType = false;
+      },
+      onConfirmProject(data){
+        this.projectList.map(res => {
+          if(res.projectName==data.text){
+            this.projectForm.projectId = res.id
+            this.projectForm.projectName = res.projectName
+            this.projectForm.projectContractor = res.projectContractor
+            this.projectForm.projectAmount = res.projectAmount
+          }
+        })
+        this.showproject = false;
+      },
+      onConfirmPayee(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showPayee = false;
+        }
+        this.chargeItme[index].payee = data.text;
+        this.chargeItme[index].payeeId = data.value;
+        this.chargeItme[index].showpayee = false;
+        this.payeeSelectChange(data.value , index)
+      },
+      onConfirmBankType(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showbankType = false;
+        }
+        this.chargeItme[index].bankTypeText = data.text;
+        this.chargeItme[index].bankType = data.value;
+        this.chargeItme[index].showbankType = false;
+      },
+      onConfirmPayer(data){
+        this.form.payer = data.text;
+        this.form.cashierId = data.value;
+        this.showpayer = false;
+        this.selectChange(data.value)
+      },
+      onConfirmLasj(data){
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
+        this.showlasj = false;
+      },
+      accountTypeChange(e){
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      // 钱计算
+      moneyChange(input) {
+        console.log(input)
+        let obj = {};
+        obj = this.chargeItme.find((account) => {
+          //model就是上面的数据源
+          return parseFloat(account.incomeAmount).toFixed(2) === input; //筛选出匹配数据
+        });
+        let total = 0;
+        this.chargeItme.forEach((money) => {
+          total = (parseFloat(total) + parseFloat(money.incomeAmount)).toFixed(2)
+        });
+        this.$set(this.form, "expenditureAmount", total);
+      },
+      goAdd(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        addTransfer(this.form).then(response => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              customSubmit(response.data.id).then(res => {
+                this.$toast.success('提交成功');
+                setTimeout(function(){
+                  history.go(-1)
+                },2000)
+              })
+            })
+          }else{
+            customSubmit(response.data.id).then(res => {
+              this.$toast.success('提交成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }
+        });
+      },
+      goUpdate(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        this.projectForm.outId = this.form.id
+        addTransfer(this.form).then((response) => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              this.$toast.success('保存成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }else{
+            this.$toast.success('保存成功');
+            setTimeout(function(){
+              history.go(-1)
+            },2000)
+          }
+        });
+      },
+      payeeSelectChange(select, i) {
+        let obj = {};
+        let fuzhitype = 0;
+        obj = this.payeeList.find((account) => {
+          //model就是上面的数据源
+          return account.id === select ; //筛选出匹配数据
+        });
+        if(this.chargeItme != [] && this.chargeItme.length>1){
+          this.chargeItme.some((value, index) => {
+            if(value.payeeAccount != undefined &&value.payeeAccount != '' && obj.payeeAccount == value.payeeAccount&&index!=i){
+              fuzhitype = 2;
+              return true;
+            }
+            if(value.accountType != undefined &&value.accountType != '' && obj.accountType != value.accountType&&index!=i){
+              fuzhitype = 1;
+              return true;
+            }
+          });
+        }
+        if(fuzhitype == 0){
+          this.$set(this.chargeItme[i], "payee",obj.payee)
+          this.$set(this.chargeItme[i], "bankType", obj.bankType)
+          this.$set(this.chargeItme[i], "payeeId", obj.id);
+          this.$set(this.chargeItme[i], "payeeAccount", obj.payeeAccount);
+          this.$set(this.chargeItme[i], "bankDeposit", obj.bankDeposit);
+          this.$set(this.chargeItme[i], "accountType", obj.accountType);
+        }else if(fuzhitype == 1){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '请选择账户类型相同的收款方！' });
+        }else if(fuzhitype == 2){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '收款方已存在！' });
+        }
+      },
+      selectChange(select) {
+        let obj = {};
+        obj = this.payerOptions.find((account) => {
+          //model就是上面的数据源
+          return account.id === select; //筛选出匹配数据
+        });
+        if(obj.payerFrom==1&&obj.operatorCode != null && obj.operatorCode != "" &&
+          obj.enterpriseCode != null && obj.enterpriseCode != "" &&
+          obj.accountPassword != null && obj.accountPassword != ""){
+          this.$set(this.form, "bookId", obj.bookId);
+          this.$set(this.form, "deptId", obj.deptId);
+          this.$set(this.form, "cashierId", obj.id);
+          this.$set(this.form, "payer", obj.accountName);
+          this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+          this.$set(this.form, "operatorCode", obj.operatorCode);
+          this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+          this.$set(this.form, "payerFrom", '1');
+        }else{
+          if(obj.payerFrom==1){
+            this.diglogStatus = false;
+            this.$notify({ type: 'danger', message: "请完善付款方“操作员代码”、“企业编码”、“支付口令”等信息！" });
+            this.$set(this.form,"payer","")
+            this.$set(this.form,"payerAccount","")
+          }else{
+            this.$set(this.form, "payerFrom", obj.parerFrom);
+            if(obj.operatorCode!=null&&obj.operatorCode!=''){
+              this.$set(this.form, "operatorCode", obj.operatorCode);
+            }else{
+              this.$set(this.form, "operatorCode", '');
+            }
+            if(obj.enterpriseCode!=null&&obj.enterpriseCode!=''){
+              this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+            }else{
+              this.$set(this.form, "enterpriseCode", '');
+            }
+            if(obj.accountPassword!=null&&obj.accountPassword!=''){
+              this.$set(this.form, "accountPassword", obj.accountPassword);
+            }else{
+              this.$set(this.form, "accountPassword", '');
+            }
+            this.$set(this.form, "bookId",'');
+            this.$set(this.form, "deptId", '');
+            this.$set(this.form, "cashierId", obj.id);
+            this.$set(this.form, "payer", obj.accountName);
+            if(obj.payerFrom==6){
+              getQmyeFlow(obj.bankAccountNumber).then((response) => {
+                this.$set(this.form, "payerAccount", response.data);
+              });
+            }else {
+              this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+            }
+          }
+        }
+      },
+      goBack(){
+        window.history.go(-1)
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+  }
+
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd5.vue

@@ -0,0 +1,764 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">添加付款申请</p>
+      </template>
+    </van-nav-bar>
+    <van-form @submit="getChange" @failed="getError" :show-error-message="false" scroll-to-error validate-first>
+      <p class="main_title">基础信息</p>
+      <div class="main_box">
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择申请时间'  }]"
+          v-model="form.applyDate"
+          label="申请时间"
+          placeholder="请选择申请时间"
+          @click="showlasj = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showlasj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmLasj"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true , message:'请选择资金支出类别' }]"
+          label="资金支出类别"
+          placeholder="请选择"
+          v-model="capitalExpenditureType"
+          @click="showcapital = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showcapital" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="capitalExpenditureTypeOptions"
+            @confirm="onConfirmCapital"
+            @cancel="showcapital = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          required
+          label="支出总金额"
+          v-model="form.expenditureAmount"
+          placeholder="根据下方收款金额自动核算"
+          input-align="right"
+          label-width="auto"
+        />
+
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field
+          label="付款事由"
+          v-model="form.remark"
+          type="textarea"
+          placeholder="请输入付款事由"
+          input-align="right"
+          rows="3"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请输入付款事由' }]"
+        />
+      </div>
+
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field label="说明情况" v-model="form.explainSituation" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      </div>
+
+      <p class="main_title" v-if="capitalExpenditureOpen">关联项目</p>
+      <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
+        <van-field
+          readonly
+          clickable
+          label="项目名称"
+          placeholder="请选择"
+          v-model="projectForm.projectName"
+          @click="showproject = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择项目名称' }]"
+        />
+        <van-popup v-model="showproject" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectListShow"
+            @confirm="onConfirmProject"
+            @cancel="showproject = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入承建单位' }]" v-model="projectForm.projectContractor" label="承建单位" placeholder="请输入承建单位" input-align="right" label-width="auto"/>
+        <van-field required :rules="[{ required: true , message:'请输入合同价款' }]" v-model="projectForm.projectAmount" label="合同价款（元）" placeholder="请输入合同价款（元）" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          label="工程款类型"
+          placeholder="请选择"
+          v-model="projectFundType"
+          @click="showFundType = true"
+          input-align="right"
+          right-icon="arrow-down"
+          required
+          :rules="[{ required: true , message:'请选择工程款类型' }]"
+        />
+        <van-popup v-model="showFundType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectFundTypeOptions"
+            @confirm="onConfirmFundType"
+            @cancel="showFundType = false"
+          />
+        </van-popup>
+        <van-field required :rules="[{ required: true , message:'请输入工程发票号' }]" v-model="projectForm.projectBillNum" label="工程发票号" placeholder="请输入工程发票号" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">付款方信息</p>
+      <div class="main_box">
+        <!--      <van-field label="付款方" v-model="form.payer" placeholder="请输入付款方" input-align="right" label-width="auto"/>-->
+        <van-field
+          readonly
+          clickable
+          label="付款方"
+          placeholder="请选择付款方"
+          v-model="form.payer"
+          @click="showpayer = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+          required
+          :rules="[{ required: true , message:'请选择付款方' }]"
+        />
+        <van-popup v-model="showpayer" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="payerOptions"
+            @confirm="onConfirmPayer($event)"
+            @cancel="showpayer = false"
+          />
+        </van-popup>
+        <van-field :rules="[{ required: true , message:'请输入付款方账户' }]" required label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">收款方信息<van-button icon="plus" @click="addChargeItme(chargeItme.length)" size="mini" type="info" native-type="button" class="addFamily"/></p>
+      <div class="main_box" style="margin-bottom: 15px;">
+        <van-cell title="收款账户类型">
+          <template #right-icon>
+            <van-radio-group direction="horizontal" v-model="form.accountType" @change="accountTypeChange">
+              <van-radio name="1">公户</van-radio>
+              <van-radio name="2">私户</van-radio>
+            </van-radio-group>
+          </template>
+        </van-cell>
+      </div>
+      <div :style="{position:'relative',padding: index == 0 ? '':'10px 0 0 0'}" v-for="(item, index) in chargeItme" :key="index">
+        <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteChargeItme(index)" />
+        <div class="main_box" style="margin-bottom: 10px;position:relative;">
+          <van-field
+            readonly
+            clickable
+            label="收款方"
+            placeholder="请选择"
+            v-model="item.payee"
+            @click="item.showPayee = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择收款方' }]"
+          />
+          <van-popup v-model="item.showPayee" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="payeeList"
+              @confirm="onConfirmPayee($event,index)"
+              @cancel="item.showPayee = false"
+            />
+          </van-popup>
+          <van-field required :rules="[{ required: true , message:'请输入账户' }]" v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入银行' }]" v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true , message:'请输入金额' }]" v-model="item.incomeAmount" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto" @change="moneyChange"/>
+          <van-field
+            readonly
+            clickable
+            label="所属银行"
+            placeholder="请选择"
+            v-model="item.bankTypeText"
+            @click="item.showbankType = true"
+            input-align="right"
+            right-icon="arrow-down"
+            required
+            :rules="[{ required: true , message:'请选择所属银行' }]"
+          />
+          <van-popup v-model="item.showbankType" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="bankTypeDictionaries"
+              @confirm="onConfirmBankType($event,index)"
+              @cancel="item.showbankType = false"
+            />
+          </van-popup>
+        </div>
+      </div>
+      <div style="padding: 16px 0;">
+        <van-row>
+          <van-col span="12" align="center">
+<!--            @click="goUpdate"-->
+            <van-button type="info" native-type="submit" @click="buttonType='update'" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
+          </van-col>
+          <van-col span="12" align="center">
+<!--            @click="goAdd"-->
+            <van-button type="info" native-type="submit" @click="buttonType='add'" class="submitButton">保存并提交</van-button>
+          </van-col>
+        </van-row>
+        <div class="clear"></div>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script>
+  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount ,getQmyeFlow} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  export default {
+    name: "approvalAdd5",
+    data() {
+      return {
+        showcapital:false,
+        showpayee:false,
+        showlasj:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
+        showpayer:false,
+
+        buttonType:'a',
+
+        minDate: new Date(),
+        maxDate: new Date(2050, 10, 1),
+        currentDate: new Date(),
+        form:{},
+
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
+
+        wfydlxDictionaries:[],
+        jglxDictionaries:[],
+        sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
+        payerOptions:[],
+
+        chargeItme:[],
+        chargeItmeShow:[],
+
+        payeeList:[],
+        // 查询参数
+        queryParams: {
+          transferType:"",
+          orderByColumn: "id",
+          isAsc: "desc",
+        },
+        capitalExpenditureOpen:false,
+        projectForm:{
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        },
+        projectFundType:''
+      };
+    },
+    created() {
+      this.reset();
+      let queryParams={
+        pageNum: 1,
+        pageSize: 100,
+      }
+      listProject(queryParams).then(response => {
+        this.projectList = response.rows;
+        for (var i = 0; i < response.rows.length; i++) {
+          this.projectListShow.push({text: response.rows[i].projectName, value: response.rows[i].id});
+        }
+      });
+      this.getDicts("project_fund_type").then((response) => {
+        for (var i = 0; i < response.data.length; i++) {
+          this.projectFundTypeOptions.push({text: response.data[i].dictLabel, value: response.data[i].dictValue});
+        }
+        this.projectFundTypeDictionaries = response.data;
+      });
+      let params1={
+        accountType: "102",
+        status: "N",
+      }
+      getAccount(params1).then((response) => {
+        this.payerOptions = response.rows;
+        response.rows.map((res,index) => {
+          res['payerFrom'] = '1'
+          console.log(res)
+          this.payerOptions[index].text = res.accountName;
+          this.payerOptions[index].value = res.id;
+        })
+      });
+      this.getDictionaries();
+    },
+    methods: {
+      // 表单重置
+      reset() {
+        this.form = {
+          id: null,
+          upId: null,
+          downId: null,
+          orderId: null,
+          cashierId: null,
+          transferType: '1',
+          accountType: '2',
+          explainSituation: null,
+          succeedAmount: null,
+          payer: null,
+          payerAccount: null,
+          operatorCode: null,
+          enterpriseCode: null,
+          expenditureAmount: null,
+          capitalExpenditureType: '1',
+          remark: null,
+          transferStatus: "0",
+          auditStatus: "0",
+          paymentState: "1",
+          bankPriority: "0",
+          clientPriority: "0"
+        };
+        this.processList = {}
+        this.projectForm={
+          projectId:null,
+          projectName:null,
+          projectContractor:null,
+          projectAmount:null,
+          projectBillNum:null,
+          projectFundType:'1',
+          outId:null,
+          ynType:'1'
+        }
+      },
+      getChange(){
+        console.log(this.buttonType)
+        if(this.buttonType == 'update'){
+          console.log('update')
+          this.goUpdate();
+        }else if(this.buttonType == 'add'){
+          console.log('add')
+          this.goAdd();
+        }
+      },
+      getDictionaries(){
+        this.getDicts("capital_expenditure_type").then((res) => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.capitalExpenditureTypeOptions.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getDicts("bank_type").then(res => {
+          for (var i = 0; i < res.data.length; i++) {
+            this.bankTypeDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+          }
+        });
+        this.getPayeeList();
+      },
+      getError(e){
+        console.log(e)
+        this.$notify({ type: 'danger', message: e.errors[0].message });
+      },
+      addChargeItme(index){
+        if(this.chargeItme.length>0&&this.chargeItme[this.chargeItme.length-1].payee == ''){
+          this.$notify({ type: 'danger', message: '请勿添加多个空列表信息' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].incomeAmount == ''){
+          this.$notify({ type: 'danger', message: '请输入收入金额！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].payeeAccount == ''){
+          this.$notify({ type: 'danger', message: '请输入收款账户！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankDeposit == ''){
+          this.$notify({ type: 'danger', message: '请输入开户银行！' });
+          return;
+        }else if(this.chargeItme.length>0&&this.chargeItme[index-1].bankType == ''){
+          this.$notify({ type: 'danger', message: '请选择所属银行！' });
+          return;
+        }
+        this.getDicts("bank_type").then(res => {
+          this.chargeItme.splice(index + 1, 0, {
+            payeeId: "", //收款方ID
+            payee: "", //收款方
+            payeeAccount: "", //收款账户
+            bankDeposit: "", //开户银行
+            incomeAmount: "", //收入金额
+            bankType: "1", //所属银行
+            bankTypeText:this.selectDictLabel(res.data, 1), //所属银行
+            showPayee:false,
+            showbankType:false
+          });
+        });
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      payeeDictLabel(datas, value) {
+        var actions = [];
+        Object.keys(datas).some((key) => {
+          if (datas[key].payeeId == ('' + value)) {
+            actions.push(datas[key].payee);
+            return true;
+          }
+        })
+        return actions.join('');
+      },
+      onConfirmCapital(data){
+        if (data.value != 2){
+          this.capitalExpenditureOpen = false;
+          this.projectForm = [];
+        }else{
+          this.capitalExpenditureOpen = true;
+        }
+        this.capitalExpenditureType = data.text;
+        this.form.capitalExpenditureType = data.value;
+        this.showcapital = false;
+      },
+      onConfirmFundType(data){
+        console.log(data)
+        this.projectForm.projectFundType = data.value;
+        this.projectFundType = data.text;
+        this.showFundType = false;
+      },
+      onConfirmProject(data){
+        this.projectList.map(res => {
+          if(res.projectName==data.text){
+            this.projectForm.projectId = res.id
+            this.projectForm.projectName = res.projectName
+            this.projectForm.projectContractor = res.projectContractor
+            this.projectForm.projectAmount = res.projectAmount
+          }
+        })
+        this.showproject = false;
+      },
+      onConfirmPayee(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showPayee = false;
+        }
+        this.chargeItme[index].payee = data.text;
+        this.chargeItme[index].payeeId = data.value;
+        this.chargeItme[index].showpayee = false;
+        this.payeeSelectChange(data.value , index)
+      },
+      onConfirmBankType(data,index){
+        for (var i = 0 ; i < this.chargeItme.length ; i++){
+          this.chargeItme[i].showbankType = false;
+        }
+        this.chargeItme[index].bankTypeText = data.text;
+        this.chargeItme[index].bankType = data.value;
+        this.chargeItme[index].showbankType = false;
+      },
+      onConfirmPayer(data){
+        this.form.payer = data.text;
+        this.form.cashierId = data.value;
+        this.showpayer = false;
+        this.selectChange(data.value)
+      },
+      onConfirmLasj(data){
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
+        this.showlasj = false;
+      },
+      accountTypeChange(e){
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
+        });
+      },
+      // 钱计算
+      moneyChange(input) {
+        console.log(input)
+        let obj = {};
+        obj = this.chargeItme.find((account) => {
+          //model就是上面的数据源
+          return parseFloat(account.incomeAmount).toFixed(2) === input; //筛选出匹配数据
+        });
+        let total = 0;
+        this.chargeItme.forEach((money) => {
+          total = (parseFloat(total) + parseFloat(money.incomeAmount)).toFixed(2)
+        });
+        this.$set(this.form, "expenditureAmount", total);
+      },
+      goAdd(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        addTransfer(this.form).then(response => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              customSubmit(response.data.id).then(res => {
+                this.$toast.success('提交成功');
+                setTimeout(function(){
+                  history.go(-1)
+                },2000)
+              })
+            })
+          }else{
+            customSubmit(response.data.id).then(res => {
+              this.$toast.success('提交成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }
+        });
+      },
+      goUpdate(){
+        if(this.chargeItme.length<1){
+          this.$notify({ type: 'danger', message: '请添加收款方信息' });
+          return;
+        }
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$notify({ type: 'danger', message: '付款事由禁止包含！' });
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$notify({ type: 'danger', message: '请选择项目名称！' });
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$notify({ type: 'danger', message: '请输入工程发票号！' });
+            return;
+          }
+        }
+        this.$set(this.form, "payeeList", this.chargeItme);
+        this.$set(this.form, "bankTypeList", this.chargeItme);
+        this.$set(this.form, "accountTypeList", this.chargeItme);
+        this.$set(this.form, "transferStatusList", this.chargeItme);
+        this.projectForm.outId = this.form.id
+        addTransfer(this.form).then((response) => {
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              this.$toast.success('保存成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }else{
+            this.$toast.success('保存成功');
+            setTimeout(function(){
+              history.go(-1)
+            },2000)
+          }
+        });
+      },
+      payeeSelectChange(select, i) {
+        let obj = {};
+        let fuzhitype = 0;
+        obj = this.payeeList.find((account) => {
+          //model就是上面的数据源
+          return account.id === select ; //筛选出匹配数据
+        });
+        if(this.chargeItme != [] && this.chargeItme.length>1){
+          this.chargeItme.some((value, index) => {
+            if(value.payeeAccount != undefined &&value.payeeAccount != '' && obj.payeeAccount == value.payeeAccount&&index!=i){
+              fuzhitype = 2;
+              return true;
+            }
+            if(value.accountType != undefined &&value.accountType != '' && obj.accountType != value.accountType&&index!=i){
+              fuzhitype = 1;
+              return true;
+            }
+          });
+        }
+        if(fuzhitype == 0){
+          this.$set(this.chargeItme[i], "payee",obj.payee)
+          this.$set(this.chargeItme[i], "bankType", obj.bankType)
+          this.$set(this.chargeItme[i], "payeeId", obj.id);
+          this.$set(this.chargeItme[i], "payeeAccount", obj.payeeAccount);
+          this.$set(this.chargeItme[i], "bankDeposit", obj.bankDeposit);
+          this.$set(this.chargeItme[i], "accountType", obj.accountType);
+        }else if(fuzhitype == 1){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '请选择账户类型相同的收款方！' });
+        }else if(fuzhitype == 2){
+          this.$set(this.chargeItme[i], "payee",'')
+          this.$set(this.chargeItme[i], "bankType",'')
+          this.$set(this.chargeItme[i], "payeeId", '');
+          this.$set(this.chargeItme[i], "payeeAccount", '');
+          this.$set(this.chargeItme[i], "bankDeposit", '');
+          this.$set(this.chargeItme[i], "accountType", '');
+          this.$notify({ type: 'danger', message: '收款方已存在！' });
+        }
+      },
+      selectChange(select) {
+        let obj = {};
+        obj = this.payerOptions.find((account) => {
+          //model就是上面的数据源
+          return account.id === select; //筛选出匹配数据
+        });
+        if(obj.payerFrom==1&&obj.operatorCode != null && obj.operatorCode != "" &&
+          obj.enterpriseCode != null && obj.enterpriseCode != "" &&
+          obj.accountPassword != null && obj.accountPassword != ""){
+          this.$set(this.form, "bookId", obj.bookId);
+          this.$set(this.form, "deptId", obj.deptId);
+          this.$set(this.form, "cashierId", obj.id);
+          this.$set(this.form, "payer", obj.accountName);
+          this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+          this.$set(this.form, "operatorCode", obj.operatorCode);
+          this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+          this.$set(this.form, "payerFrom", '1');
+        }else{
+          if(obj.payerFrom==1){
+            this.diglogStatus = false;
+            this.$notify({ type: 'danger', message: "请完善付款方“操作员代码”、“企业编码”、“支付口令”等信息！" });
+            this.$set(this.form,"payer","")
+            this.$set(this.form,"payerAccount","")
+          }else{
+            this.$set(this.form, "payerFrom", obj.parerFrom);
+            if(obj.operatorCode!=null&&obj.operatorCode!=''){
+              this.$set(this.form, "operatorCode", obj.operatorCode);
+            }else{
+              this.$set(this.form, "operatorCode", '');
+            }
+            if(obj.enterpriseCode!=null&&obj.enterpriseCode!=''){
+              this.$set(this.form, "enterpriseCode", obj.enterpriseCode);
+            }else{
+              this.$set(this.form, "enterpriseCode", '');
+            }
+            if(obj.accountPassword!=null&&obj.accountPassword!=''){
+              this.$set(this.form, "accountPassword", obj.accountPassword);
+            }else{
+              this.$set(this.form, "accountPassword", '');
+            }
+            this.$set(this.form, "bookId",'');
+            this.$set(this.form, "deptId", '');
+            this.$set(this.form, "cashierId", obj.id);
+            this.$set(this.form, "payer", obj.accountName);
+            if(obj.payerFrom==6){
+              getQmyeFlow(obj.bankAccountNumber).then((response) => {
+                this.$set(this.form, "payerAccount", response.data);
+              });
+            }else {
+              this.$set(this.form, "payerAccount", obj.bankAccountNumber);
+            }
+          }
+        }
+      },
+      goBack(){
+        window.history.go(-1)
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+  }
+
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalApproval.vue

@@ -86,7 +86,7 @@
 <script>
   import { getTransfer , queryTransferDetail , listPayee , getProjectto , listProject , approval } from "@/api/onlineHome/bankAgriculture/paymentApproval";
   export default {
-    name: "approvalModify",
+    name: "approvalApproval",
     data() {
       return {
         showcapital:false,

src/views/onlineHome/bankAgriculture/paymentApproval/approvalDetail.vue

@@ -63,7 +63,7 @@
 <script>
   import { getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit} from "@/api/onlineHome/bankAgriculture/paymentApproval";
   export default {
-    name: "approvalModify",
+    name: "approvalDetail",
     data() {
       return {
         showcapital:false,

src/views/onlineHome/bankAgriculture/paymentApproval/approvalList.vue

@@ -8,7 +8,7 @@
         @click-right="goAdd()"
       >
         <template #title>
-          <p style="font-weight: bold;">银农支付付款申请</p>
+          <p style="font-weight: bold;">常用转账申请列表</p>
         </template>
         <template #right>
           <van-icon name="add" size="18"/>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalList10.vue

@@ -0,0 +1,177 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+        @click-right="goAdd()"
+      >
+        <template #title>
+          <p style="font-weight: bold;">现金提现申请列表</p>
+        </template>
+        <template #right>
+          <van-icon name="add" size="18"/>
+        </template>
+      </van-nav-bar>
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="getList"
+      >
+        <van-swipe-cell v-for="(item,index) in applicationList" :key="index">
+          <van-cell :title="item.payer" :value="item.auditStatus" center :to="{name:'approvalDetail', query: {id:item.id}}">
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_yl.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><span><i>￥</i>{{item.expenditureAmount}}</span><i style="margin-right: 1rem;"></i>{{item.applyDate}}</p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="修改" type="info" :to="{name:'approvalModify', query: {id:item.id}}" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" color="#FFA63E" square text="提交" type="info" @click="onSubmit(item.id)" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="删除" type="danger" @click="deleteList(item.id,index)" class="delete-button" />
+              </van-col>
+            </van-row>
+          </template>
+        </van-swipe-cell>
+      </van-list>
+    </div>
+</template>
+
+<script>
+import { listTransfer , customSubmit , delTransfer } from "@/api/onlineHome/bankAgriculture/paymentApproval";
+import {listCash} from "../../../../api/onlineHome/bankAgriculture/paymentApproval";
+export default {
+  name: "approvalList10",
+  data() {
+    return {
+      applicationList:[],
+      auditStatusOptions:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        cashType: '10',
+      }
+    };
+  },
+  created() {
+    this.getDicts("audit_status").then((response) => {
+      this.auditStatusOptions = response.data;
+    });
+  },
+  methods: {
+    goAdd(){
+      window.location = 'approvalAdd10';
+    },
+    getList(){
+      setTimeout(() => {
+        listCash(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].auditStatus = this.selectDictLabel(this.auditStatusOptions, response.rows[i].auditStatus);
+            this.applicationList.push(response.rows[i]);
+          }
+          console.log(this.applicationList.length >= response.total)
+          if(this.applicationList.length >= response.total){
+            this.finished = true;
+            return;
+          }else{
+            this.loading = false;
+            this.queryParams.pageNum += 1 ;
+          }
+        });
+      }, 1000);
+    },
+    deleteList(id,index){
+      this.$dialog.confirm({
+        message: '您确认删除草稿？',
+      })
+      .then(() => {
+        // on confirm
+        this.applicationList.splice(index,1)
+        delTransfer(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('删除成功');
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    },
+    onSubmit(id){
+      this.$dialog.confirm({
+        message: '您确认提交草稿？',
+      })
+      .then(() => {
+        customSubmit(id).then(res => {
+          this.$toast.success('提交成功');
+          setTimeout(function(){
+            history.go(0)
+          },2000)
+        })
+      })
+      .catch(() => {
+        // on cancel
+      });
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+
+  }
+  /deep/.van-cell__label span{
+    color: #1D6FE9;
+    font-weight: bold;
+    i{
+      font-size: 0.2rem;
+    }
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .van-row{
+    height: 100%;
+  }
+  .van-col{
+    height: 100%;
+  }
+  .delete-button {
+    height: 100%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalList11.vue

@@ -0,0 +1,177 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+        @click-right="goAdd()"
+      >
+        <template #title>
+          <p style="font-weight: bold;">现金使用申请列表</p>
+        </template>
+        <template #right>
+          <van-icon name="add" size="18"/>
+        </template>
+      </van-nav-bar>
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="getList"
+      >
+        <van-swipe-cell v-for="(item,index) in applicationList" :key="index">
+          <van-cell :title="item.payer" :value="item.auditStatus" center :to="{name:'approvalDetail', query: {id:item.id}}">
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_yl.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><span><i>￥</i>{{item.expenditureAmount}}</span><i style="margin-right: 1rem;"></i>{{item.applyDate}}</p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="修改" type="info" :to="{name:'approvalModify', query: {id:item.id}}" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" color="#FFA63E" square text="提交" type="info" @click="onSubmit(item.id)" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="删除" type="danger" @click="deleteList(item.id,index)" class="delete-button" />
+              </van-col>
+            </van-row>
+          </template>
+        </van-swipe-cell>
+      </van-list>
+    </div>
+</template>
+
+<script>
+import { listTransfer , customSubmit , delTransfer } from "@/api/onlineHome/bankAgriculture/paymentApproval";
+import {listCash} from "../../../../api/onlineHome/bankAgriculture/paymentApproval";
+export default {
+  name: "approvalList11",
+  data() {
+    return {
+      applicationList:[],
+      auditStatusOptions:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        cashType: '11',
+      }
+    };
+  },
+  created() {
+    this.getDicts("audit_status").then((response) => {
+      this.auditStatusOptions = response.data;
+    });
+  },
+  methods: {
+    goAdd(){
+      window.location = 'approvalAdd11';
+    },
+    getList(){
+      setTimeout(() => {
+        listCash(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].auditStatus = this.selectDictLabel(this.auditStatusOptions, response.rows[i].auditStatus);
+            this.applicationList.push(response.rows[i]);
+          }
+          console.log(this.applicationList.length >= response.total)
+          if(this.applicationList.length >= response.total){
+            this.finished = true;
+            return;
+          }else{
+            this.loading = false;
+            this.queryParams.pageNum += 1 ;
+          }
+        });
+      }, 1000);
+    },
+    deleteList(id,index){
+      this.$dialog.confirm({
+        message: '您确认删除草稿？',
+      })
+      .then(() => {
+        // on confirm
+        this.applicationList.splice(index,1)
+        delTransfer(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('删除成功');
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    },
+    onSubmit(id){
+      this.$dialog.confirm({
+        message: '您确认提交草稿？',
+      })
+      .then(() => {
+        customSubmit(id).then(res => {
+          this.$toast.success('提交成功');
+          setTimeout(function(){
+            history.go(0)
+          },2000)
+        })
+      })
+      .catch(() => {
+        // on cancel
+      });
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+
+  }
+  /deep/.van-cell__label span{
+    color: #1D6FE9;
+    font-weight: bold;
+    i{
+      font-size: 0.2rem;
+    }
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .van-row{
+    height: 100%;
+  }
+  .van-col{
+    height: 100%;
+  }
+  .delete-button {
+    height: 100%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalList12.vue

@@ -0,0 +1,177 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+        @click-right="goAdd()"
+      >
+        <template #title>
+          <p style="font-weight: bold;">汇票支出申请列表</p>
+        </template>
+        <template #right>
+          <van-icon name="add" size="18"/>
+        </template>
+      </van-nav-bar>
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="getList"
+      >
+        <van-swipe-cell v-for="(item,index) in applicationList" :key="index">
+          <van-cell :title="item.payer" :value="item.auditStatus" center :to="{name:'approvalDetail', query: {id:item.id}}">
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_yl.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><span><i>￥</i>{{item.expenditureAmount}}</span><i style="margin-right: 1rem;"></i>{{item.applyDate}}</p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="修改" type="info" :to="{name:'approvalModify', query: {id:item.id}}" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" color="#FFA63E" square text="提交" type="info" @click="onSubmit(item.id)" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="删除" type="danger" @click="deleteList(item.id,index)" class="delete-button" />
+              </van-col>
+            </van-row>
+          </template>
+        </van-swipe-cell>
+      </van-list>
+    </div>
+</template>
+
+<script>
+import { listTransfer , customSubmit , delTransfer } from "@/api/onlineHome/bankAgriculture/paymentApproval";
+import {listCash} from "../../../../api/onlineHome/bankAgriculture/paymentApproval";
+export default {
+  name: "approvalList12",
+  data() {
+    return {
+      applicationList:[],
+      auditStatusOptions:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        cashType: '12',
+      }
+    };
+  },
+  created() {
+    this.getDicts("audit_status").then((response) => {
+      this.auditStatusOptions = response.data;
+    });
+  },
+  methods: {
+    goAdd(){
+      window.location = 'approvalAdd12';
+    },
+    getList(){
+      setTimeout(() => {
+        listCash(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].auditStatus = this.selectDictLabel(this.auditStatusOptions, response.rows[i].auditStatus);
+            this.applicationList.push(response.rows[i]);
+          }
+          console.log(this.applicationList.length >= response.total)
+          if(this.applicationList.length >= response.total){
+            this.finished = true;
+            return;
+          }else{
+            this.loading = false;
+            this.queryParams.pageNum += 1 ;
+          }
+        });
+      }, 1000);
+    },
+    deleteList(id,index){
+      this.$dialog.confirm({
+        message: '您确认删除草稿？',
+      })
+      .then(() => {
+        // on confirm
+        this.applicationList.splice(index,1)
+        delTransfer(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('删除成功');
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    },
+    onSubmit(id){
+      this.$dialog.confirm({
+        message: '您确认提交草稿？',
+      })
+      .then(() => {
+        customSubmit(id).then(res => {
+          this.$toast.success('提交成功');
+          setTimeout(function(){
+            history.go(0)
+          },2000)
+        })
+      })
+      .catch(() => {
+        // on cancel
+      });
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+
+  }
+  /deep/.van-cell__label span{
+    color: #1D6FE9;
+    font-weight: bold;
+    i{
+      font-size: 0.2rem;
+    }
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .van-row{
+    height: 100%;
+  }
+  .van-col{
+    height: 100%;
+  }
+  .delete-button {
+    height: 100%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalList2.vue

@@ -0,0 +1,176 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+        @click-right="goAdd()"
+      >
+        <template #title>
+          <p style="font-weight: bold;">信用开转账申请列表</p>
+        </template>
+        <template #right>
+          <van-icon name="add" size="18"/>
+        </template>
+      </van-nav-bar>
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="getList"
+      >
+        <van-swipe-cell v-for="(item,index) in applicationList" :key="index">
+          <van-cell :title="item.payer" :value="item.auditStatus" center :to="{name:'approvalDetail', query: {id:item.id}}">
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_yl.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><span><i>￥</i>{{item.expenditureAmount}}</span><i style="margin-right: 1rem;"></i>{{item.applyDate}}</p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="修改" type="info" :to="{name:'approvalModify', query: {id:item.id}}" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" color="#FFA63E" square text="提交" type="info" @click="onSubmit(item.id)" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="删除" type="danger" @click="deleteList(item.id,index)" class="delete-button" />
+              </van-col>
+            </van-row>
+          </template>
+        </van-swipe-cell>
+      </van-list>
+    </div>
+</template>
+
+<script>
+import { listTransfer , customSubmit , delTransfer } from "@/api/onlineHome/bankAgriculture/paymentApproval";
+export default {
+  name: "approvalList2",
+  data() {
+    return {
+      applicationList:[],
+      auditStatusOptions:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        transferType:"2",
+      }
+    };
+  },
+  created() {
+    this.getDicts("audit_status").then((response) => {
+      this.auditStatusOptions = response.data;
+    });
+  },
+  methods: {
+    goAdd(){
+      window.location = 'approvalAdd2';
+    },
+    getList(){
+      setTimeout(() => {
+        listTransfer(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].auditStatus = this.selectDictLabel(this.auditStatusOptions, response.rows[i].auditStatus);
+            this.applicationList.push(response.rows[i]);
+          }
+          console.log(this.applicationList.length >= response.total)
+          if(this.applicationList.length >= response.total){
+            this.finished = true;
+            return;
+          }else{
+            this.loading = false;
+            this.queryParams.pageNum += 1 ;
+          }
+        });
+      }, 1000);
+    },
+    deleteList(id,index){
+      this.$dialog.confirm({
+        message: '您确认删除草稿？',
+      })
+      .then(() => {
+        // on confirm
+        this.applicationList.splice(index,1)
+        delTransfer(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('删除成功');
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    },
+    onSubmit(id){
+      this.$dialog.confirm({
+        message: '您确认提交草稿？',
+      })
+      .then(() => {
+        customSubmit(id).then(res => {
+          this.$toast.success('提交成功');
+          setTimeout(function(){
+            history.go(0)
+          },2000)
+        })
+      })
+      .catch(() => {
+        // on cancel
+      });
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+
+  }
+  /deep/.van-cell__label span{
+    color: #1D6FE9;
+    font-weight: bold;
+    i{
+      font-size: 0.2rem;
+    }
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .van-row{
+    height: 100%;
+  }
+  .van-col{
+    height: 100%;
+  }
+  .delete-button {
+    height: 100%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalList3.vue

@@ -0,0 +1,176 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+        @click-right="goAdd()"
+      >
+        <template #title>
+          <p style="font-weight: bold;">虚拟挂账申请列表</p>
+        </template>
+        <template #right>
+          <van-icon name="add" size="18"/>
+        </template>
+      </van-nav-bar>
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="getList"
+      >
+        <van-swipe-cell v-for="(item,index) in applicationList" :key="index">
+          <van-cell :title="item.payer" :value="item.auditStatus" center :to="{name:'approvalDetail', query: {id:item.id}}">
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_yl.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><span><i>￥</i>{{item.expenditureAmount}}</span><i style="margin-right: 1rem;"></i>{{item.applyDate}}</p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="修改" type="info" :to="{name:'approvalModify', query: {id:item.id}}" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" color="#FFA63E" square text="提交" type="info" @click="onSubmit(item.id)" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="删除" type="danger" @click="deleteList(item.id,index)" class="delete-button" />
+              </van-col>
+            </van-row>
+          </template>
+        </van-swipe-cell>
+      </van-list>
+    </div>
+</template>
+
+<script>
+import { listTransfer , customSubmit , delTransfer } from "@/api/onlineHome/bankAgriculture/paymentApproval";
+export default {
+  name: "approvalList3",
+  data() {
+    return {
+      applicationList:[],
+      auditStatusOptions:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        transferType:"3",
+      }
+    };
+  },
+  created() {
+    this.getDicts("audit_status").then((response) => {
+      this.auditStatusOptions = response.data;
+    });
+  },
+  methods: {
+    goAdd(){
+      window.location = 'approvalAdd3';
+    },
+    getList(){
+      setTimeout(() => {
+        listTransfer(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].auditStatus = this.selectDictLabel(this.auditStatusOptions, response.rows[i].auditStatus);
+            this.applicationList.push(response.rows[i]);
+          }
+          console.log(this.applicationList.length >= response.total)
+          if(this.applicationList.length >= response.total){
+            this.finished = true;
+            return;
+          }else{
+            this.loading = false;
+            this.queryParams.pageNum += 1 ;
+          }
+        });
+      }, 1000);
+    },
+    deleteList(id,index){
+      this.$dialog.confirm({
+        message: '您确认删除草稿？',
+      })
+      .then(() => {
+        // on confirm
+        this.applicationList.splice(index,1)
+        delTransfer(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('删除成功');
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    },
+    onSubmit(id){
+      this.$dialog.confirm({
+        message: '您确认提交草稿？',
+      })
+      .then(() => {
+        customSubmit(id).then(res => {
+          this.$toast.success('提交成功');
+          setTimeout(function(){
+            history.go(0)
+          },2000)
+        })
+      })
+      .catch(() => {
+        // on cancel
+      });
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+
+  }
+  /deep/.van-cell__label span{
+    color: #1D6FE9;
+    font-weight: bold;
+    i{
+      font-size: 0.2rem;
+    }
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .van-row{
+    height: 100%;
+  }
+  .van-col{
+    height: 100%;
+  }
+  .delete-button {
+    height: 100%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalList4.vue

@@ -0,0 +1,176 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+        @click-right="goAdd()"
+      >
+        <template #title>
+          <p style="font-weight: bold;">虚拟专账申请列表</p>
+        </template>
+        <template #right>
+          <van-icon name="add" size="18"/>
+        </template>
+      </van-nav-bar>
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="getList"
+      >
+        <van-swipe-cell v-for="(item,index) in applicationList" :key="index">
+          <van-cell :title="item.payer" :value="item.auditStatus" center :to="{name:'approvalDetail', query: {id:item.id}}">
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_yl.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><span><i>￥</i>{{item.expenditureAmount}}</span><i style="margin-right: 1rem;"></i>{{item.applyDate}}</p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="修改" type="info" :to="{name:'approvalModify', query: {id:item.id}}" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" color="#FFA63E" square text="提交" type="info" @click="onSubmit(item.id)" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="删除" type="danger" @click="deleteList(item.id,index)" class="delete-button" />
+              </van-col>
+            </van-row>
+          </template>
+        </van-swipe-cell>
+      </van-list>
+    </div>
+</template>
+
+<script>
+import { listTransfer , customSubmit , delTransfer } from "@/api/onlineHome/bankAgriculture/paymentApproval";
+export default {
+  name: "approvalList4",
+  data() {
+    return {
+      applicationList:[],
+      auditStatusOptions:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        transferType:"4",
+      }
+    };
+  },
+  created() {
+    this.getDicts("audit_status").then((response) => {
+      this.auditStatusOptions = response.data;
+    });
+  },
+  methods: {
+    goAdd(){
+      window.location = 'approvalAdd4';
+    },
+    getList(){
+      setTimeout(() => {
+        listTransfer(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].auditStatus = this.selectDictLabel(this.auditStatusOptions, response.rows[i].auditStatus);
+            this.applicationList.push(response.rows[i]);
+          }
+          console.log(this.applicationList.length >= response.total)
+          if(this.applicationList.length >= response.total){
+            this.finished = true;
+            return;
+          }else{
+            this.loading = false;
+            this.queryParams.pageNum += 1 ;
+          }
+        });
+      }, 1000);
+    },
+    deleteList(id,index){
+      this.$dialog.confirm({
+        message: '您确认删除草稿？',
+      })
+      .then(() => {
+        // on confirm
+        this.applicationList.splice(index,1)
+        delTransfer(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('删除成功');
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    },
+    onSubmit(id){
+      this.$dialog.confirm({
+        message: '您确认提交草稿？',
+      })
+      .then(() => {
+        customSubmit(id).then(res => {
+          this.$toast.success('提交成功');
+          setTimeout(function(){
+            history.go(0)
+          },2000)
+        })
+      })
+      .catch(() => {
+        // on cancel
+      });
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+
+  }
+  /deep/.van-cell__label span{
+    color: #1D6FE9;
+    font-weight: bold;
+    i{
+      font-size: 0.2rem;
+    }
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .van-row{
+    height: 100%;
+  }
+  .van-col{
+    height: 100%;
+  }
+  .delete-button {
+    height: 100%;
+  }
+</style>

src/views/onlineHome/bankAgriculture/paymentApproval/approvalList5.vue

@@ -0,0 +1,176 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+        @click-right="goAdd()"
+      >
+        <template #title>
+          <p style="font-weight: bold;">母子转账申请列表</p>
+        </template>
+        <template #right>
+          <van-icon name="add" size="18"/>
+        </template>
+      </van-nav-bar>
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="getList"
+      >
+        <van-swipe-cell v-for="(item,index) in applicationList" :key="index">
+          <van-cell :title="item.payer" :value="item.auditStatus" center :to="{name:'approvalDetail', query: {id:item.id}}">
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_yl.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><span><i>￥</i>{{item.expenditureAmount}}</span><i style="margin-right: 1rem;"></i>{{item.applyDate}}</p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="修改" type="info" :to="{name:'approvalModify', query: {id:item.id}}" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" color="#FFA63E" square text="提交" type="info" @click="onSubmit(item.id)" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button v-if="item.auditStatus=='草稿'||item.auditStatus=='驳回'" square text="删除" type="danger" @click="deleteList(item.id,index)" class="delete-button" />
+              </van-col>
+            </van-row>
+          </template>
+        </van-swipe-cell>
+      </van-list>
+    </div>
+</template>
+
+<script>
+import { listTransfer , customSubmit , delTransfer } from "@/api/onlineHome/bankAgriculture/paymentApproval";
+export default {
+  name: "approvalList5",
+  data() {
+    return {
+      applicationList:[],
+      auditStatusOptions:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        transferType:"5",
+      }
+    };
+  },
+  created() {
+    this.getDicts("audit_status").then((response) => {
+      this.auditStatusOptions = response.data;
+    });
+  },
+  methods: {
+    goAdd(){
+      window.location = 'approvalAdd5';
+    },
+    getList(){
+      setTimeout(() => {
+        listTransfer(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].auditStatus = this.selectDictLabel(this.auditStatusOptions, response.rows[i].auditStatus);
+            this.applicationList.push(response.rows[i]);
+          }
+          console.log(this.applicationList.length >= response.total)
+          if(this.applicationList.length >= response.total){
+            this.finished = true;
+            return;
+          }else{
+            this.loading = false;
+            this.queryParams.pageNum += 1 ;
+          }
+        });
+      }, 1000);
+    },
+    deleteList(id,index){
+      this.$dialog.confirm({
+        message: '您确认删除草稿？',
+      })
+      .then(() => {
+        // on confirm
+        this.applicationList.splice(index,1)
+        delTransfer(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('删除成功');
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    },
+    onSubmit(id){
+      this.$dialog.confirm({
+        message: '您确认提交草稿？',
+      })
+      .then(() => {
+        customSubmit(id).then(res => {
+          this.$toast.success('提交成功');
+          setTimeout(function(){
+            history.go(0)
+          },2000)
+        })
+      })
+      .catch(() => {
+        // on cancel
+      });
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+
+  }
+  /deep/.van-cell__label span{
+    color: #1D6FE9;
+    font-weight: bold;
+    i{
+      font-size: 0.2rem;
+    }
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .van-row{
+    height: 100%;
+  }
+  .van-col{
+    height: 100%;
+  }
+  .delete-button {
+    height: 100%;
+  }
+</style>

src/views/onlineHome/workbench.vue

@@ -290,11 +290,53 @@
           </template>
         </van-cell>
         <van-grid :border="false">
-          <van-grid-item text="付款审批" :to="{name:'approvalList'}" >
+          <van-grid-item text="常用转账" :to="{name:'approvalList'}" >
             <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >
               <img src="../../../static/images/onlineHome/icon6.png" style="width: 25px;" alt />
             </div>
-            <p style="margin-top: 5px;color: #666666;">付款审批</p>
+            <p style="margin-top: 5px;color: #666666;">常用转账</p>
+          </van-grid-item>
+          <van-grid-item text="信用卡转账" :to="{name:'approvalList2'}" >
+            <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >
+              <img src="../../../static/images/onlineHome/icon6.png" style="width: 25px;" alt />
+            </div>
+            <p style="margin-top: 5px;color: #666666;">信用卡转账</p>
+          </van-grid-item>
+          <van-grid-item text="虚拟挂账" :to="{name:'approvalList3'}" >
+            <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >
+              <img src="../../../static/images/onlineHome/icon6.png" style="width: 25px;" alt />
+            </div>
+            <p style="margin-top: 5px;color: #666666;">虚拟挂账</p>
+          </van-grid-item>
+          <van-grid-item text="虚拟转账" :to="{name:'approvalList4'}" >
+            <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >
+              <img src="../../../static/images/onlineHome/icon6.png" style="width: 25px;" alt />
+            </div>
+            <p style="margin-top: 5px;color: #666666;">虚拟转账</p>
+          </van-grid-item>
+          <van-grid-item text="母子转账" :to="{name:'approvalList5'}" >
+            <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >
+              <img src="../../../static/images/onlineHome/icon6.png" style="width: 25px;" alt />
+            </div>
+            <p style="margin-top: 5px;color: #666666;">母子转账</p>
+          </van-grid-item>
+          <van-grid-item text="资金提现" :to="{name:'approvalList10'}" >
+            <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >
+              <img src="../../../static/images/onlineHome/icon6.png" style="width: 25px;" alt />
+            </div>
+            <p style="margin-top: 5px;color: #666666;">资金提现</p>
+          </van-grid-item>
+          <van-grid-item text="资金使用" :to="{name:'approvalList11'}" >
+            <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >
+              <img src="../../../static/images/onlineHome/icon6.png" style="width: 25px;" alt />
+            </div>
+            <p style="margin-top: 5px;color: #666666;">资金使用</p>
+          </van-grid-item>
+          <van-grid-item text="汇票支出" :to="{name:'approvalList12'}" >
+            <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >
+              <img src="../../../static/images/onlineHome/icon6.png" style="width: 25px;" alt />
+            </div>
+            <p style="margin-top: 5px;color: #666666;">汇票支出</p>
           </van-grid-item>
           <van-grid-item text="收款账户" :to="{name:'collectionList'}" >
             <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >