付款审批

src/api/onlineHome/bankAgriculture/paymentApproval.js

@@ -0,0 +1,102 @@
+import request from '@/utils/request'
+
+// 查询银行转账列表
+export function listTransfer(query) {
+  return request({
+    url: '/yinnong/transfer/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询银行转账详细
+export function getTransfer(id) {
+  return request({
+    url: '/yinnong/transfer/get/' + id,
+    method: 'get'
+  })
+}
+
+export function queryTransferDetail(transferId){
+  return request({
+    url: '/yinnong/transferDetail/getDetails/' + transferId,
+    method: 'get'
+  })
+}
+
+export function listPayee(query) {
+  return request({
+    url: '/yinnong/payee/selectlist',
+    method: 'get',
+    params: query
+  })
+}
+
+// 修改银行转账
+export function updateTransfer(data) {
+  return request({
+    url: '/yinnong/transfer/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 查询工程项目关联关系详细
+export function getProjectto(query) {
+  return request({
+    url: '/yinnong/project/getProjectto/',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询工程项目列表
+export function listProject(query) {
+  return request({
+    url: '/yinnong/project/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 新增工程项目关联关系
+export function addProjectto(data) {
+  return request({
+    url: '/yinnong/project/addProjectto',
+    method: 'post',
+    data: data
+  })
+}
+
+// 提交审批
+export function customSubmit(id) {
+  return request({
+    url: '/yinnong/transfer/customSubmit/' + id,
+    method: 'post'
+  })
+}
+
+// 新增银行转账
+export function addTransfer(data) {
+  return request({
+    url: '/yinnong/transfer/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 查询转账账户详情详细
+export function getTransferProcess(id) {
+  return request({
+    url: '/yinnong/transfer/getProcessSchedule/' + id,
+    method: 'get'
+  })
+}
+
+// 查询转账账户详情详细
+export function getCashProcess(id) {
+  return request({
+    url: '/yinnong/cash/getProcessSchedule/' + id,
+    method: 'get'
+  })
+}

src/main.js

@@ -18,7 +18,7 @@ import global from '@/utils/global';
 
 import { getDicts } from "@/utils/data";
 import { houseGetDicts } from '@/utils/data';
-import { selectDictLabel , onClickLeft , getNowFormatDate } from "@/utils/utils";
+import { selectDictLabel , onClickLeft , getNowFormatDate , format } from "@/utils/utils";
 
 //全局方法挂载
 Vue.prototype.getDicts = getDicts
@@ -26,6 +26,7 @@ Vue.prototype.houseGetDicts = houseGetDicts
 Vue.prototype.selectDictLabel = selectDictLabel
 Vue.prototype.onClickLeft = onClickLeft
 Vue.prototype.getNowFormatDate = getNowFormatDate
+Vue.prototype.format = format
 Vue.prototype.global = global
 
 // Vant 引用

src/router/index.js

@@ -969,6 +969,15 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalList'], resolve)
   },
+  {
+    path: '/approvalDetail',
+    name: 'approvalDetail',
+    meta: {
+      title: '银农支付付款申请',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/bankAgriculture/paymentApproval/approvalDetail'], resolve)
+  },
   {
     path: '/approvalAdd',
     name: 'approvalAdd',

src/utils/utils.js

@@ -48,3 +48,30 @@ export function getNowFormatDate(time) {
 
   return currentdate;
 }
+
+export function format(time, format) {
+  var t = new Date(time);
+  var tf = function (i) { return (i < 10 ? '0' : '') + i };
+  return format.replace(/yyyy|MM|dd|HH|mm|ss/g, function (a) {
+    switch (a) {
+      case 'yyyy':
+        return tf(t.getFullYear());
+        break;
+      case 'MM':
+        return tf(t.getMonth() + 1);
+        break;
+      case 'mm':
+        return tf(t.getMinutes());
+        break;
+      case 'dd':
+        return tf(t.getDate());
+        break;
+      case 'HH':
+        return tf(t.getHours());
+        break;
+      case 'ss':
+        return tf(t.getSeconds());
+        break;
+    }
+  })
+}

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

@@ -12,13 +12,13 @@
     </van-nav-bar>
     <p class="main_title">基础信息</p>
     <div class="main_box">
-      <van-field label="付款方" placeholder="请输入付款方" input-align="right" label-width="auto"/>
-      <van-field label="付款方账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
-      <van-field label="支出总金额" placeholder="根据下方收款金额自动核算" input-align="right" label-width="auto"/>
+      <van-field label="付款方" v-model="form.payer" placeholder="请输入付款方" input-align="right" label-width="auto"/>
+      <van-field label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
+      <van-field label="支出总金额" v-model="form.expenditureAmount" placeholder="根据下方收款金额自动核算" input-align="right" label-width="auto"/>
       <van-field
         readonly
         clickable
-        v-model="jgList.lasj"
+        v-model="form.applyDate"
         label="申请时间"
         placeholder="请选择申请时间"
         @click="showlasj = true"
@@ -40,23 +40,23 @@
         clickable
         label="资金支出类别"
         placeholder="请选择"
-        v-model="sfzjjzw"
-        @click="showSys = true"
+        v-model="capitalExpenditureType"
+        @click="showcapital = true"
         input-align="right"
         right-icon="arrow-down"
         label-width="auto"
       />
-      <van-popup v-model="showSys" position="bottom">
+      <van-popup v-model="showcapital" position="bottom">
         <van-picker
           show-toolbar
-          :columns="sysDictionaries"
-          @confirm="onConfirmSys"
-          @cancel="showSys = false"
+          :columns="capitalExpenditureTypeOptions"
+          @confirm="onConfirmCapital"
+          @cancel="showcapital = false"
         />
       </van-popup>
       <van-cell title="收款账户类型">
         <template #right-icon>
-          <van-radio-group direction="horizontal">
+          <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>
@@ -65,59 +65,105 @@
     </div>
 
     <div class="main_box" style="margin-top: 10px;">
-      <van-field label="付款事由" type="textarea" placeholder="请输入付款事由" input-align="right" rows="3" label-width="auto"/>
+      <van-field label="付款事由" v-model="form.remark" type="textarea" placeholder="请输入付款事由" input-align="right" rows="3" label-width="auto"/>
     </div>
 
     <div class="main_box" style="margin-top: 10px;">
-      <van-field label="说明情况" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      <van-field label="说明情况" v-model="form.explainSituation" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
     </div>
 
-    <p class="main_title">列表信息<van-button icon="plus" size="mini" type="info" native-type="button" class="addFamily"/></p>
-    <div class="main_box">
+    <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
       <van-field
         readonly
         clickable
-        label="收款方"
+        label="项目名称"
         placeholder="请选择"
-        v-model="wfydlx"
-        @click="showwfydlx = true"
+        v-model="projectForm.projectName"
+        @click="showproject = true"
         input-align="right"
         right-icon="arrow-down"
       />
-      <van-popup v-model="showwfydlx" position="bottom">
+      <van-popup v-model="showproject" position="bottom">
         <van-picker
           show-toolbar
-          :columns="wfydlxDictionaries"
-          @confirm="onConfirmWfydlx"
-          @cancel="showwfydlx = false"
+          :columns="projectListShow"
+          @confirm="onConfirmProject"
+          @cancel="showproject = false"
         />
       </van-popup>
-      <van-field v-model="jgList.wfydmj" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
-      <van-field v-model="jgList.fmkje" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
-      <van-field v-model="jgList.msmj" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto"/>
+      <van-field v-model="projectForm.projectContractor" label="承建单位" placeholder="请输入承建单位" input-align="right" label-width="auto"/>
+      <van-field v-model="projectForm.projectAmount" label="合同价款（元）" placeholder="请输入合同价款（元）" input-align="right" label-width="auto"/>
       <van-field
         readonly
         clickable
-        label="所属银行"
+        label="工程款类型"
         placeholder="请选择"
-        v-model="wfydlx"
-        @click="showwfydlx = true"
+        v-model="projectFundType"
+        @click="showFundType = true"
         input-align="right"
         right-icon="arrow-down"
       />
-      <van-popup v-model="showwfydlx" position="bottom">
+      <van-popup v-model="showFundType" position="bottom">
         <van-picker
           show-toolbar
-          :columns="wfydlxDictionaries"
-          @confirm="onConfirmWfydlx"
-          @cancel="showwfydlx = false"
+          :columns="projectFundTypeOptions"
+          @confirm="onConfirmFundType"
+          @cancel="showFundType = false"
         />
       </van-popup>
+      <van-field v-model="projectForm.projectBillNum" label="工程发票号" 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 :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="showpayee = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showpayee" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="payeeList"
+            @confirm="onConfirmPayee"
+            @cancel="showpayee = false"
+          />
+        </van-popup>
+        <van-field v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+        <van-field v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+        <van-field v-model="item.incomeAmount" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          label="所属银行"
+          placeholder="请选择"
+          v-model="item.bankTypeText"
+          @click="showbankType = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showbankType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="bankTypeDictionaries"
+            @confirm="onConfirmBankType"
+            @cancel="showbankType = false"
+          />
+        </van-popup>
+      </div>
     </div>
+
     <div style="padding: 16px 0;">
       <van-row>
         <van-col span="12" align="center">
-          <van-button type="info" native-type="submit" @click="goBack" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
+          <van-button type="info" native-type="submit" @click="goUpdate" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
         </van-col>
         <van-col span="12" align="center">
           <van-button type="info" native-type="submit" @click="goAdd" class="submitButton">保存并提交</van-button>
@@ -129,98 +175,313 @@
 </template>
 
 <script>
-  import { jgAdd } from "@/api/onlineHome/homestead/reporting";
+  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit} from "@/api/onlineHome/bankAgriculture/paymentApproval";
   export default {
-    name: "approvalAdd",
+    name: "approvalModify",
     data() {
       return {
-        showSys:false,
-        showjglx:false,
+        showcapital:false,
+        showpayee:false,
         showlasj:false,
-        showinspectorTime:false,
-        showwfydlx:false,
-        showReformDeadline:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
 
         minDate: new Date(),
         maxDate: new Date(2025, 10, 1),
         currentDate: new Date(),
-        jgList:{},
+        form:{},
 
-        sfzjjzw:'',
-        jglx:'',
-        wfydlx:'',
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
 
         wfydlxDictionaries:[],
         jglxDictionaries:[],
         sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
+
+        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 => {
+        console.log(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;
+      });
       this.getDictionaries();
     },
     methods: {
+      // 表单重置
+      reset() {
+        this.form = {
+          id: null,
+          upId: null,
+          downId: null,
+          transferType:"",
+          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'
+        }
+      },
       getDictionaries(){
-        //违法用地类型
-        this.houseGetDicts("villations_type").then((res) => {
-          for(var i = 0 ; i < res.data.length ; i++){
-            this.wfydlxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+        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.houseGetDicts("jglx").then((res) => {
-          for(var i = 0 ; i < res.data.length ; i++){
-            this.jglxDictionaries.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.houseGetDicts("sys_yes_no").then((res) => {
-          for(var i = 0 ; i < res.data.length ; i++){
-            this.sysDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+        this.getPayeeList();
+      },
+      addChargeItme(index){
+        this.chargeItme.splice(index + 1, 0, {
+          payeeId: "", //收款方ID
+          payee: "", //收款方
+          payeeAccount: "", //收款账户
+          bankDeposit: "", //开户银行
+          incomeAmount: "", //收入金额
+          bankType: "", //所属银行
+        });
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          for (var i = 0; i < response.rows.length; i++) {
+            this.payeeList.push({text: response.rows[i].payee, value: response.rows[i].id});
           }
         });
-
       },
-      onConfirmSys(data){
-        this.sfzjjzw = data.text;
-        this.jgList.sfzjjzw = data.value;
-        this.showSys = false;
+      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){
+        console.log(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){
+        console.log(data)
+        this.projectList.map(res => {
+          console.log(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
+            console.log(this.projectForm)
+          }
+        })
+        this.showproject = false;
       },
-      onConfirmJglx(data){
-        this.jglx = data.text;
-        this.jgList.jglx = data.value;
-        this.showjglx = false;
+      onConfirmPayee(data){
+        // this.chargeItme[this.chargeItme.length-1].payeeText = data.text;
+        this.chargeItme[this.chargeItme.length-1].payee = data.text;
+        this.chargeItme[this.chargeItme.length-1].payeeId = data.value;
+        console.log(this.chargeItme)
+        this.showpayee = false;
       },
-      onConfirmWfydlx(data){
-        this.wfydlx = data.text;
-        this.jgList.wfydlx = data.value;
-        this.showwfydlx = false;
+      onConfirmBankType(data){
+        console.log(this.chargeItme)
+        this.chargeItme[this.chargeItme.length-1].bankTypeText = data.text;
+        this.chargeItme[this.chargeItme.length-1].bankType = data.value;
+        this.showbankType = false;
       },
       onConfirmLasj(data){
-        this.jgList.lasj = this.getNowFormatDate(data).substr(0,10);
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
         this.showlasj = false;
       },
-      onConfirmInspectorTime(data){
-        this.jgList.inspectorTime = this.getNowFormatDate(data).substr(0,10);
-        this.showinspectorTime = false;
-      },
-      onConfirmReformDeadline(data){
-        this.jgList.reformDeadline = this.getNowFormatDate(data).substr(0,10);
-        this.showReformDeadline = false;
+      accountTypeChange(e){
+        console.log(e)
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          for (var i = 0; i < response.rows.length; i++) {
+            this.payeeList.push({text: response.rows[i].payee, value: response.rows[i].id});
+          }
+        });
       },
       goAdd(){
-        console.log(this.jgList)
-        jgAdd(this.jgList).then(response => {
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$toast.error("付款事由禁止包含|。");
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$toast.error('请选择项目名称！');
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$toast.error('请输入工程发票号！');
+            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);
+        console.log(this.form);
+        addTransfer(this.form).then(response => {
           console.log(response);
-          this.$toast.success('保存成功');
-          setTimeout(function(){
-            history.go(-1)
-          },2000)
+          this.projectForm.outId = response.data.id
+          this.$set(this.projectForm, "ynType", '1');
+          console.log(this.projectForm)
+          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.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$toast.error("付款事由禁止包含|。");
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$toast.error('请选择项目名称！');
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$toast.error('请输入工程发票号！');
+            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)
+          }
         });
       },
       goBack(){
         window.history.go(-1)
-      }
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
     },
   }
 </script>
@@ -255,4 +516,11 @@
     right: 0;
     border-radius: 50%;
   }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
 </style>

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

@@ -7,220 +7,346 @@
       @click-left="$router.back(-1)"
     >
       <template #title>
-        <p style="font-weight: bold;">添加付款申请</p>
+        <p style="font-weight: bold;">查看付款申请</p>
+      </template>
+      <template #right>
+        <van-icon name="../../../static/images/icon/icon_flow.png" size="20" @click="goFlow"/>
       </template>
     </van-nav-bar>
     <p class="main_title">基础信息</p>
     <div class="main_box">
-      <van-field label="付款方" placeholder="请输入付款方" input-align="right" label-width="auto"/>
-      <van-field label="付款方账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
-      <van-field label="支出总金额" placeholder="根据下方收款金额自动核算" input-align="right" label-width="auto"/>
-      <van-field
-        readonly
-        clickable
-        v-model="jgList.lasj"
-        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
-        label="资金支出类别"
-        placeholder="请选择"
-        v-model="sfzjjzw"
-        @click="showSys = true"
-        input-align="right"
-        right-icon="arrow-down"
-        label-width="auto"
-      />
-      <van-popup v-model="showSys" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="sysDictionaries"
-          @confirm="onConfirmSys"
-          @cancel="showSys = false"
-        />
-      </van-popup>
-      <van-cell title="收款账户类型">
-        <template #right-icon>
-          <van-radio-group direction="horizontal">
-            <van-radio name="1">公户</van-radio>
-            <van-radio name="2">私户</van-radio>
-          </van-radio-group>
-        </template>
-      </van-cell>
+      <van-field readonly label="付款方" v-model="form.payer" input-align="right" label-width="auto"/>
+      <van-field readonly label="付款方账户" v-model="form.payerAccount" input-align="right" label-width="auto"/>
+      <van-field readonly label="支出总金额" v-model="form.expenditureAmount" input-align="right" label-width="auto"/>
+      <van-field readonly label="申请时间" v-model="form.applyDate" input-align="right" />
+      <van-field readonly label="资金支出类别" v-model="capitalExpenditureType" input-align="right" label-width="auto" />
+      <van-field readonly label="收款账户类型" v-model="form.accountType == 1 ? '公户':'私户'" input-align="right" label-width="auto" />
     </div>
 
     <div class="main_box" style="margin-top: 10px;">
-      <van-field label="付款事由" type="textarea" placeholder="请输入付款事由" input-align="right" rows="3" label-width="auto"/>
+      <van-field readonly label="付款事由" v-model="form.remark" type="textarea" input-align="right" rows="3" label-width="auto"/>
     </div>
 
     <div class="main_box" style="margin-top: 10px;">
-      <van-field label="说明情况" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      <van-field readonly label="说明情况" v-model="form.explainSituation" type="textarea" input-align="right" rows="3" label-width="auto"/>
     </div>
 
-    <p class="main_title">列表信息<van-button icon="plus" size="mini" type="info" native-type="button" class="addFamily"/></p>
-    <div class="main_box">
-      <van-field
-        readonly
-        clickable
-        label="收款方"
-        placeholder="请选择"
-        v-model="wfydlx"
-        @click="showwfydlx = true"
-        input-align="right"
-        right-icon="arrow-down"
-      />
-      <van-popup v-model="showwfydlx" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="wfydlxDictionaries"
-          @confirm="onConfirmWfydlx"
-          @cancel="showwfydlx = false"
-        />
-      </van-popup>
-      <van-field v-model="jgList.wfydmj" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
-      <van-field v-model="jgList.fmkje" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
-      <van-field v-model="jgList.msmj" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto"/>
-      <van-field
-        readonly
-        clickable
-        label="所属银行"
-        placeholder="请选择"
-        v-model="wfydlx"
-        @click="showwfydlx = true"
-        input-align="right"
-        right-icon="arrow-down"
-      />
-      <van-popup v-model="showwfydlx" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="wfydlxDictionaries"
-          @confirm="onConfirmWfydlx"
-          @cancel="showwfydlx = false"
-        />
-      </van-popup>
+    <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
+      <van-field readonly label="项目名称" v-model="projectForm.projectName" input-align="right" />
+      <van-field readonly label="承建单位" v-model="projectForm.projectContractor" input-align="right" label-width="auto"/>
+      <van-field readonly label="合同价款（元）" v-model="projectForm.projectAmount" input-align="right" label-width="auto"/>
+      <van-field readonly label="工程款类型" v-model="projectFundType" input-align="right" />
+      <van-field readonly label="工程发票号" v-model="projectForm.projectBillNum" input-align="right" label-width="auto"/>
     </div>
-    <div style="padding: 16px 0;">
-      <van-row>
-        <van-col span="12" align="center">
-          <van-button type="info" native-type="submit" @click="goBack" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
-        </van-col>
-        <van-col span="12" align="center">
-          <van-button type="info" native-type="submit" @click="goAdd" class="submitButton">保存并提交</van-button>
-        </van-col>
-      </van-row>
-      <div class="clear"></div>
+
+    <p class="main_title">列表信息</p>
+    <div :style="{position:'relative',padding: index == 0 ? '':'10px 0 0 0'}" v-for="(item, index) in chargeItme" :key="index">
+      <div class="main_box" style="margin-bottom: 10px;position:relative;">
+        <van-field readonly label="收款方" v-model="item.payee" input-align="right" />
+        <van-field readonly label="收款账户" v-model="item.payeeAccount" input-align="right" label-width="auto"/>
+        <van-field readonly label="开户银行" v-model="item.bankDeposit" input-align="right" label-width="auto"/>
+        <van-field readonly label="收入金额" v-model="item.incomeAmount" input-align="right" label-width="auto"/>
+        <van-field readonly label="所属银行" v-model="item.bankTypeText" input-align="right" />
+      </div>
     </div>
   </div>
 </template>
 
 <script>
-  import { jgAdd } from "@/api/onlineHome/homestead/reporting";
+  import { getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit} from "@/api/onlineHome/bankAgriculture/paymentApproval";
   export default {
-    name: "approvalAdd",
+    name: "approvalModify",
     data() {
       return {
-        showSys:false,
-        showjglx:false,
+        showcapital:false,
+        showpayee:false,
         showlasj:false,
-        showinspectorTime:false,
-        showwfydlx:false,
-        showReformDeadline:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
 
         minDate: new Date(),
         maxDate: new Date(2025, 10, 1),
         currentDate: new Date(),
-        jgList:{},
+        form:{},
 
-        sfzjjzw:'',
-        jglx:'',
-        wfydlx:'',
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
 
         wfydlxDictionaries:[],
         jglxDictionaries:[],
         sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
 
+        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() {
+      let queryParams={
+        pageNum: 1,
+        pageSize: 100,
+      }
+      listProject(queryParams).then(response => {
+        console.log(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;
+      });
       this.getDictionaries();
     },
     methods: {
+      goFlow(){
+        window.location='approvalProcess?id='+this.$route.query.id;
+      },
       getDictionaries(){
-        //违法用地类型
-        this.houseGetDicts("villations_type").then((res) => {
-          for(var i = 0 ; i < res.data.length ; i++){
-            this.wfydlxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+        getTransfer(this.$route.query.id).then((response) => {
+          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.capitalExpenditureType = this.selectDictLabel(res.data, response.data.capitalExpenditureType);
+          });
+          if(response.data.capitalExpenditureType==2){
+            this.capitalExpenditureOpen = true
+            let param={
+              'outId' : response.data.id,
+              'ynType' : '1'
+            }
+            getProjectto(param).then(res => {
+              this.projectFundType = this.selectDictLabel(this.projectFundTypeDictionaries, res.data.projectFundType);
+              this.projectForm = res.data
+            })
+          }else{
+            this.showproject = false
           }
+          this.form = response.data;
         });
-        //监管类型
-        this.houseGetDicts("jglx").then((res) => {
-          for(var i = 0 ; i < res.data.length ; i++){
-            this.jglxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
-          }
+        queryTransferDetail(this.$route.query.id).then((response) => {
+          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});
+            }
+            for (var j = 0 ; j < response.rows.length ; j++){
+              response.rows[j].bankTypeText = this.selectDictLabel(res.data, response.rows[j].bankType);
+            }
+            this.chargeItme = response.rows;
+          });
+          this.getPayeeList();
+        });
+      },
+      addChargeItme(index){
+        this.chargeItme.splice(index + 1, 0, {
+          payeeId: "", //收款方ID
+          payee: "", //收款方
+          payeeAccount: "", //收款账户
+          bankDeposit: "", //开户银行
+          incomeAmount: "", //收入金额
+          bankType: "", //所属银行
         });
-        //是否在建建筑物
-        this.houseGetDicts("sys_yes_no").then((res) => {
-          for(var i = 0 ; i < res.data.length ; i++){
-            this.sysDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          for (var i = 0; i < response.rows.length; i++) {
+            this.payeeList.push({text: response.rows[i].payee, value: response.rows[i].id});
           }
         });
-
       },
-      onConfirmSys(data){
-        this.sfzjjzw = data.text;
-        this.jgList.sfzjjzw = data.value;
-        this.showSys = false;
+      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){
+        console.log(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;
       },
-      onConfirmJglx(data){
-        this.jglx = data.text;
-        this.jgList.jglx = data.value;
-        this.showjglx = false;
+      onConfirmFundType(data){
+        console.log(data)
+        this.projectForm.projectFundType = data.value;
+        this.projectFundType = data.text;
+        this.showFundType = false;
       },
-      onConfirmWfydlx(data){
-        this.wfydlx = data.text;
-        this.jgList.wfydlx = data.value;
-        this.showwfydlx = false;
+      onConfirmProject(data){
+        console.log(data)
+        this.projectList.map(res => {
+          console.log(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
+            console.log(this.projectForm)
+          }
+        })
+        this.showproject = false;
+      },
+      onConfirmPayee(data){
+        // this.chargeItme[this.chargeItme.length-1].payeeText = data.text;
+        this.chargeItme[this.chargeItme.length-1].payee = data.text;
+        this.chargeItme[this.chargeItme.length-1].payeeId = data.value;
+        console.log(this.chargeItme)
+        this.showpayee = false;
+      },
+      onConfirmBankType(data){
+        console.log(this.chargeItme)
+        this.chargeItme[this.chargeItme.length-1].bankTypeText = data.text;
+        this.chargeItme[this.chargeItme.length-1].bankType = data.value;
+        this.showbankType = false;
       },
       onConfirmLasj(data){
-        this.jgList.lasj = this.getNowFormatDate(data).substr(0,10);
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
         this.showlasj = false;
       },
-      onConfirmInspectorTime(data){
-        this.jgList.inspectorTime = this.getNowFormatDate(data).substr(0,10);
-        this.showinspectorTime = false;
-      },
-      onConfirmReformDeadline(data){
-        this.jgList.reformDeadline = this.getNowFormatDate(data).substr(0,10);
-        this.showReformDeadline = false;
+      accountTypeChange(e){
+        console.log(e)
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          for (var i = 0; i < response.rows.length; i++) {
+            this.payeeList.push({text: response.rows[i].payee, value: response.rows[i].id});
+          }
+        });
       },
       goAdd(){
-        console.log(this.jgList)
-        jgAdd(this.jgList).then(response => {
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$toast.error("付款事由禁止包含|。");
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$toast.error('请选择项目名称！');
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$toast.error('请输入工程发票号！');
+            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);
+        console.log(this.form);
+        updateTransfer(this.form).then(response => {
           console.log(response);
-          this.$toast.success('保存成功');
-          setTimeout(function(){
-            history.go(-1)
-          },2000)
+          this.projectForm.outId = this.form.id
+          this.$set(this.projectForm, "ynType", '1');
+          console.log(this.projectForm)
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              customSubmit(this.form.id).then(res => {
+                this.$toast.success('提交成功');
+                setTimeout(function(){
+                  history.go(-1)
+                },2000)
+              })
+            })
+          }else{
+            customSubmit(this.form.id).then(res => {
+              this.$toast.success('提交成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }
+        });
+      },
+      goUpdate(){
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$toast.error("付款事由禁止包含|。");
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$toast.error('请选择项目名称！');
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$toast.error('请输入工程发票号！');
+            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
+        updateTransfer(this.form).then((response) => {
+          this.projectForm.outId = this.form.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)
+          }
         });
       },
       goBack(){
         window.history.go(-1)
-      }
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
     },
   }
 </script>
@@ -255,4 +381,11 @@
     right: 0;
     border-radius: 50%;
   }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
 </style>

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

@@ -22,21 +22,21 @@
         @load="getList"
       >
         <van-swipe-cell v-for="(item,index) in applicationList" :key="index">
-          <van-cell title="高家庄集体经济合作社" value="草稿" center :to="{name:'applicationForm', query: {id:item.id,type:'modify'}}">
+          <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>3056.00</span><i style="margin-right: 1rem;"></i>2018-01-09</p>
+              <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 square text="修改" type="info" :to="{name:'applicationForm', query: {id:item.id}}" class="delete-button" />
+                <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 square text="删除" type="danger" @click="deleteList(item.id,index)" class="delete-button" />
+                <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>
@@ -46,27 +46,25 @@
 </template>
 
 <script>
-import { getList , removeList } from "@/api/onlineHome/homestead/application";
+import { listTransfer } from "@/api/onlineHome/bankAgriculture/paymentApproval";
 export default {
   name: "approvalList",
   data() {
     return {
       applicationList:[],
-      houseApplyStatus:[],
+      auditStatusOptions:[],
       loading: false,
       finished: false,
       queryParams:{
         pageNum:1,
         pageSize:10,
-        orderByColumn:'createTime',
-        isAsc:'desc'
+        transferType:"1",
       }
     };
   },
   created() {
-    this.houseGetDicts("house_apply_status").then((response) => {
-      console.log(response)
-      this.houseApplyStatus = response.data;
+    this.getDicts("audit_status").then((response) => {
+      this.auditStatusOptions = response.data;
     });
   },
   methods: {
@@ -75,11 +73,10 @@ export default {
     },
     getList(){
       setTimeout(() => {
-        getList(this.queryParams).then(response => {
+        listTransfer(this.queryParams).then(response => {
           console.log(response)
           for (var i = 0; i < response.rows.length; i++) {
-            var houseApplyStatus = this.selectDictLabel(this.houseApplyStatus, response.rows[i].houseApplyStatus);
-            response.rows[i].houseApplyStatus = houseApplyStatus;
+            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)

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

@@ -12,13 +12,13 @@
     </van-nav-bar>
     <p class="main_title">基础信息</p>
     <div class="main_box">
-      <van-field label="付款方" placeholder="请输入付款方" input-align="right" label-width="auto"/>
-      <van-field label="付款方账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
-      <van-field label="支出总金额" placeholder="根据下方收款金额自动核算" input-align="right" label-width="auto"/>
+      <van-field label="付款方" v-model="form.payer" placeholder="请输入付款方" input-align="right" label-width="auto"/>
+      <van-field label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
+      <van-field label="支出总金额" v-model="form.expenditureAmount" placeholder="根据下方收款金额自动核算" input-align="right" label-width="auto"/>
       <van-field
         readonly
         clickable
-        v-model="jgList.lasj"
+        v-model="form.applyDate"
         label="申请时间"
         placeholder="请选择申请时间"
         @click="showlasj = true"
@@ -40,23 +40,23 @@
         clickable
         label="资金支出类别"
         placeholder="请选择"
-        v-model="sfzjjzw"
-        @click="showSys = true"
+        v-model="capitalExpenditureType"
+        @click="showcapital = true"
         input-align="right"
         right-icon="arrow-down"
         label-width="auto"
       />
-      <van-popup v-model="showSys" position="bottom">
+      <van-popup v-model="showcapital" position="bottom">
         <van-picker
           show-toolbar
-          :columns="sysDictionaries"
-          @confirm="onConfirmSys"
-          @cancel="showSys = false"
+          :columns="capitalExpenditureTypeOptions"
+          @confirm="onConfirmCapital"
+          @cancel="showcapital = false"
         />
       </van-popup>
       <van-cell title="收款账户类型">
         <template #right-icon>
-          <van-radio-group direction="horizontal">
+          <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>
@@ -65,59 +65,105 @@
     </div>
 
     <div class="main_box" style="margin-top: 10px;">
-      <van-field label="付款事由" type="textarea" placeholder="请输入付款事由" input-align="right" rows="3" label-width="auto"/>
+      <van-field label="付款事由" v-model="form.remark" type="textarea" placeholder="请输入付款事由" input-align="right" rows="3" label-width="auto"/>
     </div>
 
     <div class="main_box" style="margin-top: 10px;">
-      <van-field label="说明情况" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
+      <van-field label="说明情况" v-model="form.explainSituation" type="textarea" placeholder="请输入说明情况" input-align="right" rows="3" label-width="auto"/>
     </div>
 
-    <p class="main_title">列表信息<van-button icon="plus" size="mini" type="info" native-type="button" class="addFamily"/></p>
-    <div class="main_box">
+    <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
       <van-field
         readonly
         clickable
-        label="收款方"
+        label="项目名称"
         placeholder="请选择"
-        v-model="wfydlx"
-        @click="showwfydlx = true"
+        v-model="projectForm.projectName"
+        @click="showproject = true"
         input-align="right"
         right-icon="arrow-down"
       />
-      <van-popup v-model="showwfydlx" position="bottom">
+      <van-popup v-model="showproject" position="bottom">
         <van-picker
           show-toolbar
-          :columns="wfydlxDictionaries"
-          @confirm="onConfirmWfydlx"
-          @cancel="showwfydlx = false"
+          :columns="projectListShow"
+          @confirm="onConfirmProject"
+          @cancel="showproject = false"
         />
       </van-popup>
-      <van-field v-model="jgList.wfydmj" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
-      <van-field v-model="jgList.fmkje" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
-      <van-field v-model="jgList.msmj" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto"/>
+      <van-field v-model="projectForm.projectContractor" label="承建单位" placeholder="请输入承建单位" input-align="right" label-width="auto"/>
+      <van-field v-model="projectForm.projectAmount" label="合同价款（元）" placeholder="请输入合同价款（元）" input-align="right" label-width="auto"/>
       <van-field
         readonly
         clickable
-        label="所属银行"
+        label="工程款类型"
         placeholder="请选择"
-        v-model="wfydlx"
-        @click="showwfydlx = true"
+        v-model="projectFundType"
+        @click="showFundType = true"
         input-align="right"
         right-icon="arrow-down"
       />
-      <van-popup v-model="showwfydlx" position="bottom">
+      <van-popup v-model="showFundType" position="bottom">
         <van-picker
           show-toolbar
-          :columns="wfydlxDictionaries"
-          @confirm="onConfirmWfydlx"
-          @cancel="showwfydlx = false"
+          :columns="projectFundTypeOptions"
+          @confirm="onConfirmFundType"
+          @cancel="showFundType = false"
         />
       </van-popup>
+      <van-field v-model="projectForm.projectBillNum" label="工程发票号" 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 :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="showpayee = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showpayee" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="payeeList"
+            @confirm="onConfirmPayee"
+            @cancel="showpayee = false"
+          />
+        </van-popup>
+        <van-field v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+        <van-field v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+        <van-field v-model="item.incomeAmount" label="收入金额" placeholder="请输入金额" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          label="所属银行"
+          placeholder="请选择"
+          v-model="item.bankTypeText"
+          @click="showbankType = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showbankType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="bankTypeDictionaries"
+            @confirm="onConfirmBankType"
+            @cancel="showbankType = false"
+          />
+        </van-popup>
+      </div>
     </div>
+
     <div style="padding: 16px 0;">
       <van-row>
         <van-col span="12" align="center">
-          <van-button type="info" native-type="submit" @click="goBack" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
+          <van-button type="info" native-type="submit" @click="goUpdate" class="submitButton">保<i style="margin-right: 1em;"></i>存</van-button>
         </van-col>
         <van-col span="12" align="center">
           <van-button type="info" native-type="submit" @click="goAdd" class="submitButton">保存并提交</van-button>
@@ -129,98 +175,301 @@
 </template>
 
 <script>
-  import { jgAdd } from "@/api/onlineHome/homestead/reporting";
+  import { getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit} from "@/api/onlineHome/bankAgriculture/paymentApproval";
   export default {
-    name: "approvalAdd",
+    name: "approvalModify",
     data() {
       return {
-        showSys:false,
-        showjglx:false,
+        showcapital:false,
+        showpayee:false,
         showlasj:false,
-        showinspectorTime:false,
-        showwfydlx:false,
-        showReformDeadline:false,
+        showbankType:false,
+        showproject:false,
+        showFundType:false,
 
         minDate: new Date(),
         maxDate: new Date(2025, 10, 1),
         currentDate: new Date(),
-        jgList:{},
+        form:{},
 
-        sfzjjzw:'',
-        jglx:'',
-        wfydlx:'',
+        capitalExpenditureType:'',
+        payee:'',
+        bankType:'',
 
         wfydlxDictionaries:[],
         jglxDictionaries:[],
         sysDictionaries:[],
+        capitalExpenditureTypeOptions:[],
+        bankTypeDictionaries:[],
+        projectList:[],
+        projectFundTypeOptions:[],
+        projectFundTypeDictionaries:[],
+        projectListShow:[],
+
+        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() {
+      let queryParams={
+        pageNum: 1,
+        pageSize: 100,
+      }
+      listProject(queryParams).then(response => {
+        console.log(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;
+      });
       this.getDictionaries();
     },
     methods: {
       getDictionaries(){
-        //违法用地类型
-        this.houseGetDicts("villations_type").then((res) => {
-          for(var i = 0 ; i < res.data.length ; i++){
-            this.wfydlxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+        getTransfer(this.$route.query.id).then((response) => {
+          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.capitalExpenditureType = this.selectDictLabel(res.data, response.data.capitalExpenditureType);
+          });
+          if(response.data.capitalExpenditureType==2){
+            this.capitalExpenditureOpen = true
+            let param={
+              'outId' : response.data.id,
+              'ynType' : '1'
+            }
+            getProjectto(param).then(res => {
+              console.log(this.selectDictLabel(this.projectFundTypeDictionaries, res.data.projectFundType))
+              this.projectFundType = this.selectDictLabel(this.projectFundTypeDictionaries, res.data.projectFundType);
+              this.projectForm = res.data
+              console.log(res.data)
+            })
+          }else{
+            this.showproject = false
           }
+          this.form = response.data;
         });
-        //监管类型
-        this.houseGetDicts("jglx").then((res) => {
-          for(var i = 0 ; i < res.data.length ; i++){
-            this.jglxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
-          }
+        queryTransferDetail(this.$route.query.id).then((response) => {
+          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});
+            }
+            for (var j = 0 ; j < response.rows.length ; j++){
+              // response.rows[j].payeeText = response.rows[j].payee;
+              response.rows[j].bankTypeText = this.selectDictLabel(res.data, response.rows[j].bankType);
+            }
+          });
+          this.chargeItme = response.rows;
+          console.log(response.rows)
+          this.getPayeeList();
         });
-        //是否在建建筑物
-        this.houseGetDicts("sys_yes_no").then((res) => {
-          for(var i = 0 ; i < res.data.length ; i++){
-            this.sysDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+      },
+      addChargeItme(index){
+        this.chargeItme.splice(index + 1, 0, {
+          payeeId: "", //收款方ID
+          payee: "", //收款方
+          payeeAccount: "", //收款账户
+          bankDeposit: "", //开户银行
+          incomeAmount: "", //收入金额
+          bankType: "", //所属银行
+        });
+      },
+      getPayeeList() {
+        //普通转账
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          for (var i = 0; i < response.rows.length; i++) {
+            this.payeeList.push({text: response.rows[i].payee, value: response.rows[i].id});
           }
         });
-
       },
-      onConfirmSys(data){
-        this.sfzjjzw = data.text;
-        this.jgList.sfzjjzw = data.value;
-        this.showSys = false;
+      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){
+        console.log(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){
+        console.log(data)
+        this.projectList.map(res => {
+          console.log(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
+            console.log(this.projectForm)
+          }
+        })
+        this.showproject = false;
       },
-      onConfirmJglx(data){
-        this.jglx = data.text;
-        this.jgList.jglx = data.value;
-        this.showjglx = false;
+      onConfirmPayee(data){
+        // this.chargeItme[this.chargeItme.length-1].payeeText = data.text;
+        this.chargeItme[this.chargeItme.length-1].payee = data.text;
+        this.chargeItme[this.chargeItme.length-1].payeeId = data.value;
+        console.log(this.chargeItme)
+        this.showpayee = false;
       },
-      onConfirmWfydlx(data){
-        this.wfydlx = data.text;
-        this.jgList.wfydlx = data.value;
-        this.showwfydlx = false;
+      onConfirmBankType(data){
+        console.log(this.chargeItme)
+        this.chargeItme[this.chargeItme.length-1].bankTypeText = data.text;
+        this.chargeItme[this.chargeItme.length-1].bankType = data.value;
+        this.showbankType = false;
       },
       onConfirmLasj(data){
-        this.jgList.lasj = this.getNowFormatDate(data).substr(0,10);
+        this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
         this.showlasj = false;
       },
-      onConfirmInspectorTime(data){
-        this.jgList.inspectorTime = this.getNowFormatDate(data).substr(0,10);
-        this.showinspectorTime = false;
-      },
-      onConfirmReformDeadline(data){
-        this.jgList.reformDeadline = this.getNowFormatDate(data).substr(0,10);
-        this.showReformDeadline = false;
+      accountTypeChange(e){
+        console.log(e)
+        this.payeeList = [];
+        this.queryParams.accountType = this.form.accountType
+        this.queryParams.status = "0"
+        listPayee(this.queryParams).then((response) => {
+          for (var i = 0; i < response.rows.length; i++) {
+            this.payeeList.push({text: response.rows[i].payee, value: response.rows[i].id});
+          }
+        });
       },
       goAdd(){
-        console.log(this.jgList)
-        jgAdd(this.jgList).then(response => {
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$toast.error("付款事由禁止包含|。");
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$toast.error('请选择项目名称！');
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$toast.error('请输入工程发票号！');
+            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);
+        console.log(this.form);
+        updateTransfer(this.form).then(response => {
           console.log(response);
-          this.$toast.success('保存成功');
-          setTimeout(function(){
-            history.go(-1)
-          },2000)
+          this.projectForm.outId = this.form.id
+          this.$set(this.projectForm, "ynType", '1');
+          console.log(this.projectForm)
+          if(this.form.capitalExpenditureType==2){
+            addProjectto(this.projectForm).then(res => {
+              customSubmit(this.form.id).then(res => {
+                this.$toast.success('提交成功');
+                setTimeout(function(){
+                  history.go(-1)
+                },2000)
+              })
+            })
+          }else{
+            customSubmit(this.form.id).then(res => {
+              this.$toast.success('提交成功');
+              setTimeout(function(){
+                history.go(-1)
+              },2000)
+            })
+          }
+        });
+      },
+      goUpdate(){
+        if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
+          this.$toast.error("付款事由禁止包含|。");
+          return;
+        }
+        if(this.form.capitalExpenditureType==2){
+          if(this.projectForm.projectName==""||this.projectForm.projectName==null){
+            this.$toast.error('请选择项目名称！');
+            return;
+          }
+          if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
+            this.$toast.error('请输入工程发票号！');
+            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
+        updateTransfer(this.form).then((response) => {
+          this.projectForm.outId = this.form.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)
+          }
         });
       },
       goBack(){
         window.history.go(-1)
-      }
+      },
+      //删除家庭成员
+      deleteChargeItme(index){
+        this.chargeItme.splice(index,1)
+      },
     },
   }
 </script>
@@ -255,4 +504,11 @@
     right: 0;
     border-radius: 50%;
   }
+  .deleteFamily{
+    position: absolute;
+    top: 0rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
 </style>

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

@@ -5,62 +5,333 @@
         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>
       <div class="main_box">
-        <van-row>
-          <van-col span="6"></van-col>
+        <van-row v-if="processList.待申请!=2">
+          <van-col span="6" align="right"><p class="icon_jian blue"><van-icon name="success" size="14" /></p></van-col>
           <van-col span="18" class="textBlue">草稿</van-col>
         </van-row>
-        <van-row>
+        <van-row v-if="processList.待申请==2">
           <van-col span="6" align="right"><p class="icon_jian blue"><van-icon name="success" size="14" /></p></van-col>
-          <van-col span="18" class="textBlue">待审批
+          <van-col span="18" class="textBlue">已申请
             <van-row>
-              <van-col span="10" style="padding: 0;">已通过</van-col>
-              <van-col span="14" style="padding: 0;">2021-09-01</van-col>
+              <van-col span="10" style="padding: 0;" v-show="processList.已申请">{{processList.申请人}}</van-col>
+              <van-col span="14" style="padding: 0;" v-show="processList.已申请">{{processList.申请时间}}</van-col>
             </van-row>
           </van-col>
         </van-row>
         <van-row>
-          <van-col span="6" align="right"><p class="icon_jian"><van-icon name="minus" size="14" /></p></van-col>
-          <van-col span="18">乡镇审批</van-col>
+          <van-col span="6" align="right">
+            <p class="icon_jian" v-show="processList.乡镇审批==1"><van-icon name="minus" size="14" /></p>
+            <p class="icon_jian blue" v-show="processList.乡镇审批==2"><van-icon name="success" size="14" /></p>
+            <p class="icon_jian red" v-show="processList.乡镇审批==3"><van-icon name="cross" size="14" /></p>
+          </van-col>
+          <van-col span="18">
+            <p v-show="processList.乡镇审批==1">乡镇审批</p>
+            <p v-show="processList.乡镇审批==2">乡镇审批</p>
+            <p v-show="processList.乡镇审批==3">乡镇审批</p>
+            <van-row>
+              <van-col span="10" style="padding: 0;" v-if="processList.待申请==2">
+                <p v-show="processList.乡镇审批==1">审批人：{{processList.乡镇审批人}}</p>
+                <p v-show="processList.乡镇审批==2">审批人：{{processList.乡镇审批人}}</p>
+                <p v-show="processList.乡镇审批==3">审批人：{{processList.乡镇审批人}}</p>
+              </van-col>
+              <van-col span="14" style="padding: 0;" v-if="processList.待申请==2">
+                <p v-show="processList.乡镇审批==1">审批时间：{{processList.乡镇审批时间}}</p>
+                <p v-show="processList.乡镇审批==2">审批时间：{{processList.乡镇审批时间}}</p>
+                <p v-show="processList.乡镇审批==3">审批时间：{{processList.乡镇审批时间}}</p>
+              </van-col>
+            </van-row>
+          </van-col>
         </van-row>
-        <van-row>
-          <van-col span="6" align="right"><p class="icon_jian"><van-icon name="minus" size="14" /></p></van-col>
-          <van-col span="18">区县审批</van-col>
+        <van-row v-if="form.approveLevel==2">
+          <van-col span="6" align="right">
+            <p class="icon_jian" v-show="processList.区县审批==1"><van-icon name="minus" size="14" /></p>
+            <p class="icon_jian blue" v-show="processList.区县审批==2"><van-icon name="success" size="14" /></p>
+            <p class="icon_jian red" v-show="processList.区县审批==3"><van-icon name="cross" size="14" /></p>
+          </van-col>
+          <van-col span="18">
+            <p v-show="processList.区县审批==1">区县审批</p>
+            <p v-show="processList.区县审批==2">区县审批</p>
+            <p v-show="processList.区县审批==3">区县审批</p>
+            <van-row>
+              <van-col span="10" style="padding: 0;">
+                <p v-show="processList.区县审批==1">审批人：{{processList.区县审批人}}</p>
+                <p v-show="processList.区县审批==2">审批人：{{processList.区县审批人}}</p>
+                <p v-show="processList.区县审批==3">审批人：{{processList.区县审批人}}</p>
+              </van-col>
+              <van-col span="14" style="padding: 0;">
+                <p v-show="processList.区县审批==1">审批时间：{{processList.区县审批时间}}</p>
+                <p v-show="processList.区县审批==2">审批时间：{{processList.区县审批时间}}</p>
+                <p v-show="processList.区县审批==3">审批时间：{{processList.区县审批时间}}</p>
+              </van-col>
+            </van-row>
+          </van-col>
         </van-row>
-        <van-row>
-          <van-col span="6" align="right"><p class="icon_jian"><van-icon name="minus" size="14" /></p></van-col>
-          <van-col span="18">待支付</van-col>
+        <van-row v-show="form.transferType==1||form.transferType=='常用转账'">
+          <van-col span="6" align="right">
+            <p class="icon_jian" v-show="processList.支付状态==1"><van-icon name="minus" size="14" /></p>
+            <p class="icon_jian blue" v-show="processList.支付状态==2"><van-icon name="success" size="14" /></p>
+            <p class="icon_jian red" v-show="processList.支付状态==3"><van-icon name="cross" size="14" /></p>
+          </van-col>
+          <van-col span="18">
+            <p v-show="processList.支付状态==1">待支付</p>
+            <p v-show="processList.支付状态==2">支付成功</p>
+            <p v-show="processList.支付状态==3">支付异常</p>
+            <van-row>
+              <van-col span="24" style="padding: 0;">
+                <p v-show="processList.支付状态==2||processList.支付状态==3">支付时间：{{processList.支付时间}}</p>
+              </van-col>
+            </van-row>
+          </van-col>
         </van-row>
-        <van-row>
-          <van-col span="6" align="right"><p class="icon_jian"><van-icon name="minus" size="14" /></p></van-col>
-          <van-col span="18">未入账</van-col>
+        <van-row v-show="form.transferType==1||form.transferType=='常用转账'">
+          <van-col span="6" align="right">
+            <p class="icon_jian" v-show="processList.入账状态==1"><van-icon name="minus" size="14" /></p>
+            <p class="icon_jian blue" v-show="processList.入账状态==2"><van-icon name="success" size="14" /></p>
+            <p class="icon_jian red" v-show="processList.入账状态==3"><van-icon name="cross" size="14" /></p>
+          </van-col>
+          <van-col span="18">
+            <p v-show="processList.入账状态==1">未入账</p>
+            <p v-show="processList.入账状态==2">入账成功</p>
+            <p v-show="processList.入账状态==3">入账异常</p>
+            <van-row>
+              <van-col span="24" style="padding: 0;">
+                <p v-show="processList.入账状态==2||processList.入账状态==3">入账时间：{{processList.入账时间}}</p>
+              </van-col>
+            </van-row>
+          </van-col>
         </van-row>
       </div>
     </div>
 </template>
 
 <script>
+import {
+  getTransferProcess,
+  getProjectto,
+  getCashProcess
+} from "@/api/onlineHome/bankAgriculture/paymentApproval";
 export default {
   name: "approvalProcess",
   data() {
     return {
-
+      // 工程项目关联信息
+      capitalExpenditureOpen:false,
+      isAudit:false,
+      //收款方记录
+      chargeItme: [],
+      // 资金支出类别
+      capitalExpenditureTypeOptions: [],
+      bankTypeList: [],
+      accountTypeList: [],
+      transferTypeList:[],
+      projectFundTypeOptions:[],
+      expands: [],
+      // 审核意见默认值
+      pass: "true",
+      comment: "同意",
+      getRowKeys(row) {
+        return row.id;
+      },
+      // 表单参数
+      form: {
+        id: null,
+        orderId: null,
+        payer: null,
+        payerAccount: null,
+        expenditureAmount: null,
+        remark: null,
+        transferStatus: "0",
+        auditStatus: "0",
+        paymentState: "1",
+        bankPriority: "0",
+        clientPriority: "0",
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+      },
+      // 关联工程项目信息
+      projectForm:{
+        projectId:null,
+        projectName:null,
+        projectContractor:null,
+        projectAmount:null,
+        projectBillNum:null,
+        projectFundType:null,
+        outId:null,
+        ynType:'1'
+      },
+      auditStatus:false,
+      processList:{},
     };
   },
   created() {
+    this.getDicts("capital_expenditure_type").then(response => {
+      this.capitalExpenditureTypeOptions = response.data;
+      for(let j of this.capitalExpenditureTypeOptions){
+        if(j.dictValue==this.form.capitalExpenditureType){
+          this.form.capitalExpenditureType  = j.dictLabel
+        }
+      }
+    });
+    this.getDicts("bank_type").then(response => {
+      this.bankTypeList = response.data;
+      for(let i of this.chargeItme){
+        for(let j of this.bankTypeList){
+          if(j.dictValue==i.bankType){
+            i.bankType  = j.dictLabel
+          }
+        }
+      }
+    });
+    this.getDicts("bank_account_type").then(response => {
+      this.accountTypeList = response.data;
+    });
+    this.getDicts("transfer_type").then(response => {
+      this.transferTypeList = response.data;
+      for(let j of this.transferTypeList){
+        if(j.dictValue==this.form.transferType){
+          this.form.transferType  = j.dictLabel
+        }
+      }
+    });
+    this.form = this.formList;
+    if(this.form.cashType==1){
+      this.form.cashType = "现金提现"
+    }else if(this.form.cashType==2){
+      this.form.cashType = "现金使用"
+    }else if(this.form.cashType==3){
+      this.form.cashType = "汇票支出"
+    }
 
+    this.chargeItme = this.lists;
+    if (this.formType == "audit") {
+      // 如果是审核表单
+      this.auditStatus=true;
+      this.isAudit=true;
+    }else{
+      this.isAudit=false;
+      if(this.form.transferType!=null){
+        this.getTransferProcess(this.form.id)
+      }else{
+        this.getCashProcess(this.form.id)
+      }
+    }
+
+    if(this.form.capitalExpenditureType==2){
+      this.capitalExpenditureOpen=true
+      let params
+      if(this.form.transferType!=null){
+        params = {
+          'outId':this.form.id,
+          'ynType':'1'
+        }
+      }else {
+        params = {
+          'outId':this.form.id,
+          'ynType':'2'
+        }
+      }
+      getProjectto(params).then(res => {
+        this.projectForm = res.data
+        this.getDicts("project_fund_type").then(response => {
+          this.projectFundTypeOptions = response.data;
+          for(let j of this.projectFundTypeOptions){
+            if(j.dictValue==this.projectForm.projectFundType){
+              this.projectForm.projectFundType  = j.dictLabel
+            }
+          }
+        });
+      })
+    }else{
+      this.capitalExpenditureOpen=false
+    }
+    // this.getCashProcess(this.form.id)
   },
   methods: {
-
+    //查询审批进程
+    getTransferProcess(id){
+      getTransferProcess(id).then(res => {
+        this.processList = res.data.processSchedule
+        this.processList.乡镇审批时间 = this.processList.乡镇审批时间?this.format(this.processList.乡镇审批时间, "yyyy-MM-dd HH:mm:ss"):""
+        this.processList.区县审批时间 = this.processList.区县审批时间?this.format(this.processList.区县审批时间, "yyyy-MM-dd HH:mm:ss"):""
+        this.processList.支付状态时间 = this.processList.支付状态时间?this.format(this.processList.支付状态时间, "yyyy-MM-dd HH:mm:ss"):""
+        this.processList.入账状态时间 = this.processList.入账状态时间?this.format(this.processList.入账状态时间, "yyyy-MM-dd HH:mm:ss"):""
+      })
+    },
+    //查询审批进程
+    getCashProcess(id){
+      getCashProcess(id).then(res => {
+        this.processList = res.data.processSchedule
+        this.processList.乡镇审批时间 = this.processList.乡镇审批时间?this.format(this.processList.乡镇审批时间, "yyyy-MM-dd HH:mm:ss"):""
+        this.processList.区县审批时间 = this.processList.区县审批时间?this.format(this.processList.区县审批时间, "yyyy-MM-dd HH:mm:ss"):""
+        this.processList.支付状态时间 = this.processList.支付状态时间?this.format(this.processList.支付状态时间, "yyyy-MM-dd HH:mm:ss"):""
+        this.processList.入账状态时间 = this.processList.入账状态时间?this.format(this.processList.入账状态时间, "yyyy-MM-dd HH:mm:ss"):""
+      })
+    },
+    // 取消按钮
+    cancel() {
+      this.recordOpen = false;
+      this.reset();
+      this.$emit("refreshList");
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        orderId: null,
+        payer: null,
+        payerAccount: null,
+        expenditureAmount: null,
+        remark: null,
+        transferStatus: "0",
+        auditStatus: "0",
+        paymentState: "1",
+        bankPriority: "0",
+        clientPriority: "0",
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+      };
+      this.resetForm("form");
+    },
+    /** 提交按钮 */
+    submitForm() {
+      const data = {
+        taskId: this.form.taskId,
+        instanceId: this.form.instanceId,
+        variables: JSON.stringify({
+          comment: this.comment,
+          pass: this.pass,
+          //"formData": this.row,
+        }),
+      };
+      return request({
+        url: "/activiti/process/complete",
+        method: "post",
+        params: data,
+      }).then((response) => {
+        if(response.code==200 && response.msg=="操作成功"){
+          this.msgSuccess("操作成功");
+        } else{
+          this.msgSuccess("操作失败");
+        }
+        this.$emit("getList");
+        this.$emit("refreshList");
+      });
+    },
+  },
+  watch: {
+    pass: function (val) {
+      this.comment = val === "true" ? "同意" : "驳回";
+    },
   },
 }
 </script>
@@ -91,9 +362,15 @@ export default {
   .blue{
     background-color: #1D6FE9;
   }
+  .red{
+    background-color: rgb(245, 108, 108);
+  }
   .textBlue{
     color: #1D6FE9!important;
   }
+  .textRed{
+    color: rgb(245, 108, 108)!important;
+  }
   .van-col{
     padding: 20Px 10Px;
   }