From 6e2f493f16380098ca3a21934d3988e80a4e5cec Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BA=9E=E4=B8=9C=E6=97=AD?= <850374051@qq.com>
Date: Thu, 23 Sep 2021 16:42:38 +0800
Subject: [PATCH] =?UTF-8?q?=E9=97=AE=E9=A2=98=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bankAgriculture/paymentApproval.js        |    8 +
 src/router/index.js                           |    9 +
 .../paymentApproval/approvalAdd.vue           |  484 +++++---
 .../paymentApproval/approvalDetail.vue        |   16 +-
 .../paymentApproval/approvalModify.vue        |  519 +++++---
 .../homestead/homeApproval/approvalForm.vue   | 1085 +++++++++++++++++
 6 files changed, 1801 insertions(+), 320 deletions(-)
 create mode 100644 src/views/onlineHome/homestead/homeApproval/approvalForm.vue

diff --git a/src/api/onlineHome/bankAgriculture/paymentApproval.js b/src/api/onlineHome/bankAgriculture/paymentApproval.js
index a52e7a58..7b6eb300 100644
--- a/src/api/onlineHome/bankAgriculture/paymentApproval.js
+++ b/src/api/onlineHome/bankAgriculture/paymentApproval.js
@@ -108,3 +108,11 @@ export function getAccount(query){
     params: query
   })
 }
+
+// 查询当前账期余额
+export function getQmyeFlow(id) {
+  return request({
+    url: '/cashier/flow/getQmye/' + id,
+    method: 'post'
+  })
+}
diff --git a/src/router/index.js b/src/router/index.js
index 66ad60a4..dea24b0d 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -978,6 +978,15 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/onlineHome/homestead/supervision/supervisionCloseCase'], resolve)
   },
+  {
+    path: '/approvalForm',
+    name: 'approvalForm',
+    meta: {
+      title: '宅基地审批',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/homeApproval/approvalForm'], resolve)
+  },
   {
     path: '/approvalList',
     name: 'approvalList',
diff --git a/src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd.vue b/src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd.vue
index 87d75cd4..a4cb31e2 100644
--- a/src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd.vue
+++ b/src/views/onlineHome/bankAgriculture/paymentApproval/approvalAdd.vue
@@ -10,131 +10,164 @@
         <p style="font-weight: bold;">添加付款申请</p>
       </template>
     </van-nav-bar>
-    <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"
-      />
-      <van-popup v-model="showpayer" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="payerOptions"
-          @confirm="onConfirmPayer"
-          @cancel="showpayer = false"
+    <van-form>
+      <p class="main_title">基础信息</p>
+      <div class="main_box">
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true }]"
+          v-model="form.applyDate"
+          label="申请时间"
+          placeholder="请选择申请时间"
+          @click="showlasj = true"
+          input-align="right"
+          right-icon="arrow-down"
         />
-      </van-popup>
-      <van-field label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
-      <van-field readonly label="支出总金额" v-model="form.expenditureAmount" placeholder="根据下方收款金额自动核算" input-align="right" label-width="auto"/>
-      <van-field
-        readonly
-        clickable
-        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 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 }]"
+          label="资金支出类别"
+          placeholder="请选择"
+          v-model="capitalExpenditureType"
+          @click="showcapital = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
         />
-      </van-popup>
-      <van-field
-        readonly
-        clickable
-        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 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"
         />
-      </van-popup>
-      <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 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"/>
-    </div>
+      </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>
+      <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 }]"
+        />
+      </div>
 
-    <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"
-      />
-      <van-popup v-model="showproject" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="projectListShow"
-          @confirm="onConfirmProject"
-          @cancel="showproject = false"
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field required :rules="[{ required: true }]" 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"
         />
-      </van-popup>
-      <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="工程款类型"
-        placeholder="请选择"
-        v-model="projectFundType"
-        @click="showFundType = true"
-        input-align="right"
-        right-icon="arrow-down"
-      />
-      <van-popup v-model="showFundType" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="projectFundTypeOptions"
-          @confirm="onConfirmFundType"
-          @cancel="showFundType = false"
+        <van-popup v-model="showproject" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="projectListShow"
+            @confirm="onConfirmProject"
+            @cancel="showproject = false"
+          />
+        </van-popup>
+        <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="工程款类型"
+          placeholder="请选择"
+          v-model="projectFundType"
+          @click="showFundType = true"
+          input-align="right"
+          right-icon="arrow-down"
         />
-      </van-popup>
-      <van-field v-model="projectForm.projectBillNum" label="工程发票号" placeholder="请输入工程发票号" input-align="right" label-width="auto"/>
-    </div>
+        <van-popup v-model="showFundType" position="bottom">
+          <van-picker
+            show-toolbar
+            :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">付款方信息</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 }]"
+        />
+        <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 }]" 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>
 
-    <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">
+      <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
@@ -143,42 +176,46 @@
           label="收款方"
           placeholder="请选择"
           v-model="item.payee"
-          @click="showpayee = true"
+          @click="item.showPayee = true"
           input-align="right"
           right-icon="arrow-down"
+          required
+          :rules="[{ required: true }]"
         />
-        <van-popup v-model="showpayee" position="bottom">
+        <van-popup v-model="item.showPayee" position="bottom">
           <van-picker
             show-toolbar
             :columns="payeeList"
-            @confirm="onConfirmPayee"
-            @cancel="showpayee = false"
+            @confirm="onConfirmPayee($event,index)"
+            @cancel="item.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" @change="moneyChange"/>
+        <van-field required :rules="[{ required: true }]" v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+        <van-field required :rules="[{ required: true }]" v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+        <van-field required :rules="[{ required: true }]" 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="showbankType = true"
+          @click="item.showbankType = true"
           input-align="right"
           right-icon="arrow-down"
+          required
+          :rules="[{ required: true }]"
         />
-        <van-popup v-model="showbankType" position="bottom">
+        <van-popup v-model="item.showbankType" position="bottom">
           <van-picker
             show-toolbar
             :columns="bankTypeDictionaries"
-            @confirm="onConfirmBankType"
-            @cancel="showbankType = false"
+            @confirm="onConfirmBankType($event,index)"
+            @cancel="item.showbankType = false"
           />
         </van-popup>
       </div>
     </div>
-
+    </van-form>
     <div style="padding: 16px 0;">
       <van-row>
         <van-col span="12" align="center">
@@ -194,7 +231,7 @@
 </template>
 
 <script>
-  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  import { addTransfer , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit , getAccount ,getQmyeFlow} from "@/api/onlineHome/bankAgriculture/paymentApproval";
   export default {
     name: "approvalModify",
     data() {
@@ -258,7 +295,6 @@
         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});
@@ -275,9 +311,13 @@
         status: "N",
       }
       getAccount(params1).then((response) => {
-        for (var i = 0; i < response.rows.length; i++) {
-          this.payerOptions.push({text: response.rows[i].accountName, value: response.rows[i].id})
-        }
+        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();
     },
@@ -288,7 +328,6 @@
           id: null,
           upId: null,
           downId: null,
-          transferType:"",
           orderId: null,
           cashierId: null,
           transferType: '1',
@@ -337,14 +376,31 @@
         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.chargeItme.splice(index + 1, 0, {
-          payeeId: "", //收款方ID
-          payee: "", //收款方
-          payeeAccount: "", //收款账户
-          bankDeposit: "", //开户银行
-          incomeAmount: "", //收入金额
-          bankType: "", //所属银行
+        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() {
@@ -352,9 +408,11 @@
         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});
-          }
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
         });
       },
       payeeDictLabel(datas, value) {
@@ -368,7 +426,6 @@
         return actions.join('');
       },
       onConfirmCapital(data){
-        console.log(data)
         if (data.value != 2){
           this.capitalExpenditureOpen = false;
           this.projectForm = [];
@@ -386,50 +443,53 @@
         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;
       },
-      onConfirmPayee(data){
-        // this.chargeItme[this.chargeItme.length-1].payeeText = data.text;
-        console.log(this.chargeItme.length)
-        this.chargeItme[this.chargeItme.length-1].payee = data.text;
-        this.chargeItme[this.chargeItme.length-1].payeeId = data.value;
-        this.showpayee = 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){
-        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;
+      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){
-        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});
-          }
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
         });
       },
       // 钱计算
@@ -528,6 +588,104 @@
           }
         });
       },
+      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)
       },
diff --git a/src/views/onlineHome/bankAgriculture/paymentApproval/approvalDetail.vue b/src/views/onlineHome/bankAgriculture/paymentApproval/approvalDetail.vue
index 12b3c619..0f0289cb 100644
--- a/src/views/onlineHome/bankAgriculture/paymentApproval/approvalDetail.vue
+++ b/src/views/onlineHome/bankAgriculture/paymentApproval/approvalDetail.vue
@@ -15,12 +15,9 @@
     </van-nav-bar>
     <p class="main_title">基础信息</p>
     <div class="main_box">
-      <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" />
+      <van-field readonly label="支出总金额" v-model="form.expenditureAmount" input-align="right" label-width="auto"/>
     </div>
 
     <div class="main_box" style="margin-top: 10px;">
@@ -31,6 +28,12 @@
       <van-field readonly label="说明情况" v-model="form.explainSituation" type="textarea" input-align="right" rows="3" label-width="auto"/>
     </div>
 
+    <p class="main_title">付款方信息</p>
+    <div class="main_box">
+      <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"/>
+    </div>
+
     <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"/>
@@ -40,6 +43,11 @@
     </div>
 
     <p class="main_title">列表信息</p>
+
+    <div class="main_box" style="margin-bottom: 15px;">
+      <van-field readonly label="收款账户类型" v-model="form.accountType == 1 ? '公户':'私户'" input-align="right" label-width="auto" />
+    </div>
+
     <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" />
diff --git a/src/views/onlineHome/bankAgriculture/paymentApproval/approvalModify.vue b/src/views/onlineHome/bankAgriculture/paymentApproval/approvalModify.vue
index e88de953..2301b712 100644
--- a/src/views/onlineHome/bankAgriculture/paymentApproval/approvalModify.vue
+++ b/src/views/onlineHome/bankAgriculture/paymentApproval/approvalModify.vue
@@ -7,159 +7,215 @@
       @click-left="$router.back(-1)"
     >
       <template #title>
-        <p style="font-weight: bold;">添加付款申请</p>
+        <p style="font-weight: bold;">修改付款申请</p>
       </template>
     </van-nav-bar>
-    <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 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="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-form>
+      <p class="main_title">基础信息</p>
+      <div class="main_box">
+        <van-field
+          readonly
+          clickable
+          required
+          :rules="[{ required: true }]"
+          v-model="form.applyDate"
+          label="申请时间"
+          placeholder="请选择申请时间"
+          @click="showlasj = true"
+          input-align="right"
+          right-icon="arrow-down"
         />
-      </van-popup>
-      <van-field
-        readonly
-        clickable
-        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 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 }]"
+          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"
         />
-      </van-popup>
-      <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 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"/>
-    </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>
+      </div>
 
-    <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"
-      />
-      <van-popup v-model="showproject" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="projectListShow"
-          @confirm="onConfirmProject"
-          @cancel="showproject = false"
-        />
-      </van-popup>
-      <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="工程款类型"
-        placeholder="请选择"
-        v-model="projectFundType"
-        @click="showFundType = true"
-        input-align="right"
-        right-icon="arrow-down"
-      />
-      <van-popup v-model="showFundType" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="projectFundTypeOptions"
-          @confirm="onConfirmFundType"
-          @cancel="showFundType = false"
+      <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 }]"
         />
-      </van-popup>
-      <van-field v-model="projectForm.projectBillNum" label="工程发票号" placeholder="请输入工程发票号" input-align="right" label-width="auto"/>
-    </div>
+      </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;">
+      <div class="main_box" style="margin-top: 10px;">
+        <van-field required :rules="[{ required: true }]" 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="收款方"
+          label="项目名称"
           placeholder="请选择"
-          v-model="item.payee"
-          @click="showpayee = true"
+          v-model="projectForm.projectName"
+          @click="showproject = true"
           input-align="right"
           right-icon="arrow-down"
         />
-        <van-popup v-model="showpayee" position="bottom">
+        <van-popup v-model="showproject" position="bottom">
           <van-picker
             show-toolbar
-            :columns="payeeList"
-            @confirm="onConfirmPayee"
-            @cancel="showpayee = false"
+            :columns="projectListShow"
+            @confirm="onConfirmProject"
+            @cancel="showproject = 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 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="item.bankTypeText"
-          @click="showbankType = true"
+          v-model="projectFundType"
+          @click="showFundType = true"
           input-align="right"
           right-icon="arrow-down"
         />
-        <van-popup v-model="showbankType" position="bottom">
+        <van-popup v-model="showFundType" position="bottom">
           <van-picker
             show-toolbar
-            :columns="bankTypeDictionaries"
-            @confirm="onConfirmBankType"
-            @cancel="showbankType = 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">付款方信息</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 }]"
+        />
+        <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 }]" required label="付款方账户" v-model="form.payerAccount" placeholder="请输入账户" input-align="right" label-width="auto"/>
       </div>
-    </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 }]"
+          />
+          <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 }]" v-model="item.payeeAccount" label="收款账户" placeholder="请输入账户" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true }]" v-model="item.bankDeposit" label="开户银行" placeholder="请输入银行" input-align="right" label-width="auto"/>
+          <van-field required :rules="[{ required: true }]" 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 }]"
+          />
+          <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>
+    </van-form>
     <div style="padding: 16px 0;">
       <van-row>
         <van-col span="12" align="center">
@@ -175,7 +231,7 @@
 </template>
 
 <script>
-  import { getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  import { getAccount , getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit ,getQmyeFlow} from "@/api/onlineHome/bankAgriculture/paymentApproval";
   export default {
     name: "approvalModify",
     data() {
@@ -186,6 +242,7 @@
         showbankType:false,
         showproject:false,
         showFundType:false,
+        showpayer:false,
 
         minDate: new Date(),
         maxDate: new Date(2025, 10, 1),
@@ -205,6 +262,7 @@
         projectFundTypeOptions:[],
         projectFundTypeDictionaries:[],
         projectListShow:[],
+        payerOptions:[],
 
         chargeItme:[],
         chargeItmeShow:[],
@@ -236,7 +294,6 @@
         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});
@@ -248,6 +305,19 @@
         }
         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: {
@@ -284,21 +354,42 @@
             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);
+              response.rows[j].showPayee = false;
             }
+            this.chargeItme = response.rows;
           });
-          this.chargeItme = response.rows;
-          console.log(response.rows)
           this.getPayeeList();
         });
       },
       addChargeItme(index){
-        this.chargeItme.splice(index + 1, 0, {
-          payeeId: "", //收款方ID
-          payee: "", //收款方
-          payeeAccount: "", //收款账户
-          bankDeposit: "", //开户银行
-          incomeAmount: "", //收入金额
-          bankType: "", //所属银行
+        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() {
@@ -306,9 +397,11 @@
         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});
-          }
+          this.payeeList = response.rows;
+          response.rows.map((res,index) => {
+            this.payeeList[index].text = res.payee;
+            this.payeeList[index].value = res.id;
+          })
         });
       },
       payeeDictLabel(datas, value) {
@@ -340,46 +433,68 @@
         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;
       },
-      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;
+      onConfirmPayee(data,index){
+        console.log(data)
+        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.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;
       },
-      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;
+      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){
-        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});
-          }
+          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.form.remark != null && this.form.remark.indexOf("|")!=-1){
@@ -463,6 +578,104 @@
           }
         });
       },
+      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)
       },
diff --git a/src/views/onlineHome/homestead/homeApproval/approvalForm.vue b/src/views/onlineHome/homestead/homeApproval/approvalForm.vue
new file mode 100644
index 00000000..90d57a37
--- /dev/null
+++ b/src/views/onlineHome/homestead/homeApproval/approvalForm.vue
@@ -0,0 +1,1085 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        title="用地建房申请"
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+      >
+        <template #right>
+          <van-icon name="../../../static/images/icon/icon_flow.png" size="20" @click="goFlow"/>
+        </template>
+      </van-nav-bar>
+      <van-steps :active="active" active-color="#38f">
+        <van-step>申请</van-step>
+        <van-step>开工</van-step>
+        <van-step>验收</van-step>
+      </van-steps>
+      <p class="topTit">农村宅基地和建房（规划许可）申请表</p>
+      <div class="main">
+        <van-form>
+          <div v-if="applicationDetail.tHouseApplyProposer">
+            <p class="main_title">申请用户信息</p>
+            <div class="main_box">
+            <van-field readonly v-model="applicationDetail.tHouseApplyProposer.memberName" label="姓名" placeholder="姓名" input-align="right"/>
+            <van-field
+              readonly
+              v-model="sexValue"
+              label="性别"
+              input-align="right"
+            />
+            <van-field readonly v-model="applicationDetail.tHouseApplyProposer.age" label="年龄" placeholder="年龄" input-align="right"/>
+            <van-field readonly v-model="applicationDetail.tHouseApplyProposer.phone" label="联系电话" placeholder="联系电话" input-align="right"/>
+            <van-field readonly v-model="applicationDetail.tHouseApplyProposer.idcard" label="身份证号" placeholder="身份证号" input-align="right"/>
+            <van-field readonly v-model="applicationDetail.tHouseApplyProposer.householdRegister" label="户口所在地" placeholder="户口所在地" input-align="right"/>
+            <van-field readonly v-model="applicationDetail.tHouseApplyProposer.familyAddress" label="家庭住址" placeholder="家庭住址" input-align="right"/>
+            <van-field readonly v-model="applicationDetail.tHouseApplyProposer.members" label="家庭人口数" placeholder="家庭人口数" input-align="right"/>
+            <van-cell title="是否已有宅基地">
+              <template #right-icon>
+                {{applicationDetail.tHouseApplyProposer.existHomestead == 'Y' ? '是' : '否'}}
+              </template>
+            </van-cell>
+          </div>
+          </div>
+
+          <div v-if="applicationDetail.tHouseApplyFamilyMembers && applicationDetail.tHouseApplyFamilyMembers!=''">
+            <p class="main_title">家庭成员信息</p>
+            <van-collapse  v-model="activeNames">
+              <van-collapse-item  class="collapse" v-for="(item , index) in applicationDetail.tHouseApplyFamilyMembers" :key="index" :name="index+1">
+                <template #title>
+                  <van-row>
+                    <van-col span="8">{{item.memberName}}</van-col>
+                    <van-col span="8">{{item.age}}</van-col>
+                    <van-col span="8">{{item.familyStatusName}}</van-col>
+                  </van-row>
+                </template>
+                <van-field readonly v-model="item.memberName" label="姓名" placeholder="姓名" input-align="right"/>
+                <van-field readonly v-model="item.age" label="年龄" placeholder="年龄" input-align="right"/>
+                <van-field readonly v-model="item.familyStatusName" label="与户主关系" placeholder="与户主关系" input-align="right"/>
+                <van-field readonly v-model="item.idcard" label="身份证号" placeholder="身份证号" input-align="right"/>
+                <van-field readonly v-model="item.householdRegister" label="户口所在地" placeholder="户口所在地" input-align="right"/>
+              </van-collapse-item>
+            </van-collapse>
+          </div>
+
+          <div v-if="CurrentSituation">
+            <p class="main_title">现宅基地及农房状况</p>
+            <div class="main_box">
+              <van-field readonly v-model="applicationDetail.tHouseApplyCurrentSituation.landArea" label="宅基地面积" placeholder="宅基地面积" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyCurrentSituation.landPerArea" label="人均宅基地面积" placeholder="人均宅基地面积㎡" input-align="right" label-width="auto"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyCurrentSituation.landCertificateNo" label="不动产单元号" placeholder="不动产单元号" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyCurrentSituation.buildingArea" label="建筑面积" placeholder="建筑面积㎡" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyCurrentSituation.buildingPerArea" label="人均建筑面积" placeholder="人均建筑面积㎡" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyCurrentSituation.houseCertificateNo" label="农民房屋幢号" placeholder="户口所在地" input-align="right"/>
+              <van-field readonly v-model="landIsposalValue" label="处置情况" input-align="right" />
+            </div>
+          </div>
+
+          <div v-if="applicationDetail.tHouseApplyProposedSituation">
+            <p class="main_title">拟申请宅基地及建房情况</p>
+            <div class="main_box">
+              <van-field readonly v-model="applicationDetail.tHouseApplyProposedSituation.location" label="拟建位置" placeholder="拟建位置" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyProposedSituation.landArea" label="宅基地面积" placeholder="宅基地面积" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyProposedSituation.east" label="东至" placeholder="东至" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyProposedSituation.west" label="西至" placeholder="西至" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyProposedSituation.south" label="南至" placeholder="南至" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyProposedSituation.north" label="北至" placeholder="北至" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyProposedSituation.buildingArea" label="建筑面积" placeholder="建筑面积" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyProposedSituation.buildingFloors" label="建筑层数" placeholder="建筑层数" input-align="right"/>
+              <van-field readonly v-model="applicationDetail.tHouseApplyProposedSituation.buildingHight" label="建筑高度" placeholder="建筑高度" input-align="right"/>
+              <van-cell title="是否征求相邻权利人意见">
+                <template #right-icon>
+                  {{applicationDetail.tHouseApplyProposedSituation.isAdvice == '1' ? '是' : '否'}}
+                </template>
+              </van-cell>
+              <van-field readonly v-model="housingStructureValue" label="房屋构造" input-align="right" />
+              <van-field readonly v-model="buildingTypeValue" label="建房类型" input-align="right" />
+              <van-cell title="设计图纸">
+                <template #right-icon>
+                  {{applicationDetail.tHouseApplyProposedSituation.designPaper == '1' ? '委托设计' : '选通用图'}}
+                </template>
+              </van-cell>
+              <van-field readonly v-model="houseTypeValue" input-align="right" v-if="showHouse" />
+            </div>
+            <div class="mapBox">
+              <div id="mapWrap" style="height: 200px;"></div>
+            </div>
+          </div>
+
+          <div v-if="applicationDetail.tHouseApplyProposer">
+            <p class="main_title">申请理由</p>
+            <div class="main_box">
+            <van-field
+              rows="3"
+              autosize
+              type="textarea"
+              input-align="left"
+              v-model="applicationDetail.tHouseApplyProposer.applyReasion"
+              readonly
+            />
+            <van-row>
+              <van-col span="12"><van-field readonly v-model="applicationDetail.tHouseApplyProposer.memberName" label="申请人" placeholder="申请人" input-align="left" label-width="auto"/></van-col>
+              <van-col span="12">
+                <van-field readonly clickable v-model="applicationDetail.tHouseApplyProposer.applyTime" label-width="auto">
+                  <template #label>
+                    <van-icon name="notes-o" size="20"/>
+                  </template>
+                </van-field>
+              </van-col>
+            </van-row>
+          </div>
+          </div>
+
+          <div v-if="item.findList" v-for="(item , index) in fileArray" :key="index">
+            <p class="main_title">{{item.fileTypeName}}</p><!-- 未对接 -->
+            <div class="main_box file-box">
+<!--              <van-uploader v-if="item.findList" v-model="item.findList" multiple />-->
+              <van-uploader :after-read="afterRead" :before-delete="deleteFile" v-model="item.findList" multiple />
+            </div>
+          </div>
+<!--          <p class="main_title">宅基地使用承诺书</p>&lt;!&ndash; 未对接 &ndash;&gt;-->
+<!--          <div class="main_box file-box">-->
+<!--            <van-uploader v-model="fileList2" multiple class="aaa" />-->
+<!--          </div>-->
+
+          <div v-if="false" :class="active==1?'':'noModify'" >
+            <p class="topTit">宅基地开工</p>
+            <div class="main_box action-box">
+            <van-cell title="计划开工时间">
+              <template #right-icon>
+                <van-radio-group v-model="radio" direction="horizontal">
+                  <van-field readonly clickable style="padding: 0" v-model="applicationDetail.tHouseApplyStart.startDate" label-width="auto" placeholder="选择日期" @click="showStartDate = true">
+                    <template #label>
+                      <van-icon name="notes-o" size="20"/>
+                    </template>
+                  </van-field>
+                  <van-calendar v-model="showStartDate" @confirm="onConfirmStartDate" />
+                </van-radio-group>
+              </template>
+            </van-cell>
+            <van-cell title="计划竣工时间">
+              <template #right-icon>
+                <van-radio-group v-model="radio" direction="horizontal">
+                  <van-field readonly clickable style="padding: 0" v-model="applicationDetail.tHouseApplyStart.endDate" label-width="auto" placeholder="选择日期" @click="showEndDate = true">
+                    <template #label>
+                      <van-icon name="notes-o" size="20"/>
+                    </template>
+                  </van-field>
+                  <van-calendar v-model="showEndDate" @confirm="onConfirmEndDate" />
+                </van-radio-group>
+              </template>
+            </van-cell>
+          </div>
+          </div>
+          <!--applicationDetail.tHouseApplyStart-->
+          <div v-if="false" style="margin: 16px;">
+            <van-row>
+              <van-col span="12" align="center">
+                <van-button type="info" native-type="submit" class="submitButton">保存</van-button>
+              </van-col>
+              <van-col span="12" align="center">
+                <van-button type="info" native-type="submit" class="submitButton">保存并提交</van-button>
+              </van-col>
+            </van-row>
+            <div class="clear"></div>
+          </div>
+
+          <div v-if="false" :class="active==2?'':'noModify'">
+            <p class="topTit">宅基地验收申请</p>
+            <div class="main_box check-box">
+            <van-field v-model="applicationDetail.tHouseApplyEnd.memberName" label="申请户主姓名" placeholder="申请户主姓名" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.idcard" label="身份证号" placeholder="身份证号" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.location" label="用地建房位置" placeholder="用地建房位置" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.licenseKey" label="乡村建设规划许可证号" placeholder="乡村建设规划许可证号" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.approvalNumber" label="农村宅基地批准书号" placeholder="农村宅基地批准书号" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.startDate" label="开工日期" readonly clickable input-align="right" label-width="auto" placeholder="选择开工日期" @click="showCalendar = true"></van-field>
+            <van-calendar />
+            <van-field v-model="applicationDetail.tHouseApplyEnd.endDate" label="竣工日期" readonly clickable input-align="right" label-width="auto" placeholder="选择竣工日期" @click="showCalendar = true"></van-field>
+            <van-calendar />
+            <van-field v-model="applicationDetail.tHouseApplyEnd.houseCertificateNo" label="权属证书号（不动产）" placeholder="权属证书号（不动产）" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.landCertificateNo" label="权属证书号（宅基地）" placeholder="权属证书号（宅基地）" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.buildingHight" label="批建高度" placeholder="建筑高度" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.buildingFloors" label="批建层数" placeholder="批建层数" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.actualBuildingHight" label="竣工高度" placeholder="竣工高度" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.actualBuildingFloors" label="竣工层数" placeholder="竣工层数" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.buildingArea" label="建筑面积" placeholder="建筑面积" input-align="right" label-width="auto"/>
+            <van-field v-model="applicationDetail.tHouseApplyEnd.designPaper" label="建筑风貌" placeholder="建筑风貌" input-align="right" label-width="auto"/>
+            <van-cell title="旧宅基地退还情况">
+              <template #right-icon>
+                <van-radio-group v-model="applicationDetail.tHouseApplyEnd.oldHouseStatus" direction="horizontal">
+                  <van-radio name="0">是</van-radio>
+                  <van-radio name="1">否</van-radio>
+                </van-radio-group>
+              </template>
+            </van-cell>
+            <van-field label="备注" placeholder="" input-align="right"/>
+          </div>
+          </div>
+          <!--applicationDetail.tHouseApplyEnd-->
+          <div v-if="false" style="margin: 16px;">
+            <van-row>
+              <van-col span="12" align="center">
+                <van-button type="info" native-type="submit" class="submitButton">保存</van-button>
+              </van-col>
+              <van-col span="12" align="center">
+                <van-button type="info" native-type="submit" class="submitButton">保存并提交</van-button>
+              </van-col>
+            </van-row>
+            <div class="clear"></div>
+          </div>
+
+        </van-form>
+
+      <!--        审核流程开始-->
+        <div class="main_box examine_box">
+          <van-row type="flex" justify="space-between" align="center">
+            <van-col span="5">审核<br/>意见</van-col>
+            <van-col span="19">
+              <van-radio-group v-model="radio" direction="horizontal">
+                <van-radio name="1">同意</van-radio>
+                <van-radio name="2">驳回</van-radio>
+              </van-radio-group>
+              <van-field rows="2" autosize readonly type="textarea" placeholder="同意申请宅基地"/>
+            </van-col>
+          </van-row>
+        </div>
+
+        <div class="main_box examine_box">
+          <van-row type="flex" justify="space-between" align="center">
+            <van-col span="5">农业<br/>农村<br/>部门<br/>审查<br/>意见</van-col>
+            <van-col span="19">
+              <van-cell-group>
+                <van-cell title="成员资格审查">
+                  <template #right-icon>
+                    <van-radio-group v-model="radio" direction="horizontal" style="padding: 0; border: 0;">
+                      <van-radio name="1">通过</van-radio>
+                      <van-radio name="2">不通过</van-radio>
+                    </van-radio-group>
+                  </template>
+                </van-cell>
+                <van-cell title="一户一宅情况">
+                  <template #right-icon>
+                    <van-radio-group v-model="radio" direction="horizontal" style="padding: 0; border: 0;">
+                      <van-radio name="1">符合</van-radio>
+                      <van-radio name="2">不符合</van-radio>
+                    </van-radio-group>
+                  </template>
+                </van-cell>
+                <van-cell title="村委会审查资料">
+                  <template #right-icon>
+                    <van-radio-group v-model="radio" direction="horizontal" style="padding: 0; border: 0;">
+                      <van-radio name="1">齐全</van-radio>
+                      <van-radio name="2">不齐全</van-radio>
+                    </van-radio-group>
+                  </template>
+                </van-cell>
+              </van-cell-group>
+              <van-field rows="2" autosize readonly type="textarea" placeholder="审查意见"/>
+            </van-col>
+          </van-row>
+        </div>
+
+        <div class="main_box examine_box">
+          <van-row type="flex" justify="space-between" align="center">
+            <van-col span="5">自然<br/>资源<br/>部门<br/>意见</van-col>
+            <van-col span="19">
+              <van-field v-model="value" label="用地面积" placeholder="请输入" input-align="right">
+                <template #right-icon>
+                  ㎡
+                </template>
+              </van-field>
+              <van-field v-model="value" label="土地权属" placeholder="请选择" readonly input-align="right" is-link arrow-direction="down"/>
+              <van-field v-model="value" label="东至" placeholder="请输入" input-align="right"/>
+              <van-field v-model="value" label="南至" placeholder="请输入" input-align="right"/>
+              <van-field v-model="value" label="西至" placeholder="请输入" input-align="right"/>
+              <van-field v-model="value" label="北至" placeholder="请输入" input-align="right"/>
+              <van-field rows="2" autosize readonly type="textarea" placeholder="审查意见"/>
+            </van-col>
+          </van-row>
+        </div>
+
+        <div class="main_box examine_box">
+          <van-row type="flex" justify="space-between" align="center">
+            <van-col span="5">农业<br/>农村<br/>部门<br/>审查<br/>意见</van-col>
+            <van-col span="19">
+              <van-field v-model="value" label="建筑类型" placeholder="请选择" readonly input-align="right" is-link arrow-direction="down"/>
+              <van-field v-model="value" label="图纸类型" placeholder="请选择" readonly input-align="right" is-link arrow-direction="down"/>
+
+              <van-field v-model="value" label="建筑占地面积" placeholder="请输入" input-align="right">
+                <template #right-icon>
+                  ㎡
+                </template>
+              </van-field>
+
+              <van-field v-model="value" label="建筑面积" placeholder="请输入" input-align="right">
+                <template #right-icon>
+                  ㎡
+                </template>
+              </van-field>
+
+              <van-field v-model="value" label="建筑层数" placeholder="请输入" input-align="right">
+                <template #right-icon>
+                  层
+                </template>
+              </van-field>
+
+              <van-field v-model="value" label="建筑高度" placeholder="请输入" input-align="right">
+                <template #right-icon>
+                  m
+                </template>
+              </van-field>
+              <van-field v-model="value" label="东至" placeholder="请输入" input-align="right"/>
+              <van-field v-model="value" label="南至" placeholder="请输入" input-align="right"/>
+              <van-field v-model="value" label="西至" placeholder="请输入" input-align="right"/>
+              <van-field v-model="value" label="北至" placeholder="请输入" input-align="right"/>
+              <van-field rows="2" autosize readonly type="textarea" placeholder="审批意见"/>
+            </van-col>
+          </van-row>
+        </div>
+
+        <div class="main_box examine_box">
+          <van-row type="flex" justify="space-between" align="center">
+            <van-col span="5">上传<br/>附件</van-col>
+            <van-col span="19">
+              <van-uploader v-model="fileList" multiple style="margin-bottom: 0;" />
+            </van-col>
+          </van-row>
+        </div>
+      <!--        审核流程结束-->
+      </div>
+
+    </div>
+</template>
+
+<script>
+  import { allInformation , treeSingleProcessView , attachmentFind , saveHouseBaseInfo , houseList , attach , removeFile , saveHouseBaseInfoThenSubmit} from "@/api/onlineHome/homestead/application";
+  import $ from "jquery";
+  export default {
+  name: "applicationForm",
+  data() {
+    return {
+      active: 0,
+      nowTime: '',//当前日期
+      fileList: [],
+      fileList2: [],
+      radio:'1',
+      value: '',
+      columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
+      showPicker: false,
+      showBuildingType: false,
+      showLandIsposal: false,
+      showHousingStructure: false,
+      showStartDate: false,
+      showEndDate: false,
+      showApplyTime:false,
+      showHouseType:false,
+      showHouse:false,
+      showSex:false,
+      id:'',
+      applicationDetail:[],
+      //建房类型字典
+      buildingType:[],
+      //性别字典
+      userSex:[],
+      //处置情况字典
+      landIsposal:[],
+      //房屋构造字典
+      housingStructure:[],
+      //户型
+      houseType:[],
+      //请求参数
+      parameter:{
+        businessType: "house",
+        houseApplyStatus: '',
+        processKey: "baseApply",
+        tableName: "t_house_apply_proposer"
+      },
+      //文件配置
+      fileArray:[],
+      //获取上传附件
+      params:{
+        tableId: '',
+        tableName: "t_house_apply_proposer",
+        fileType: ''
+      },
+      auditStatus:false,
+      activeNames:['1'],
+      housingStructureValue:'',//当前显示房屋构造
+      buildingTypeValue:'',//当前显示建房类型
+      landIsposalValue:'',//当前显示处置情况
+      houseTypeValue:'',//当前显示户型
+      sexValue:'',//当前显示性别
+      CurrentSituation:false,
+    };
+  },
+  created() {
+    this.id = this.$route.query.id;
+    this.type = this.$route.query.type;
+    this.getDetail();
+  },
+  methods: {
+    goFlow(){
+      window.location='flowChart?id='+this.id;
+    },
+    //更新文件回显
+    afterRead(file) {
+      this.$forceUpdate();
+    },
+    //删除图片
+    deleteFile(elIndex){
+      if(elIndex.id != ''){
+        removeFile(elIndex.id).then(response => {});
+      }
+      this.$forceUpdate();
+      return (file, name) => {
+        let fileIndex = name.index
+        this.fileList[elIndex].splice(fileIndex, 1)
+        this.upLoadList[elIndex].splice(fileIndex, 1)
+      }
+    },
+    //获取数据集合
+    getDetail(){
+      allInformation(this.id).then(response => {
+        //性别字典查询
+        this.houseGetDicts("sys_user_sex").then((res) => {
+          res.data.map(item => {
+            this.userSex.push({ value:item.dictValue, text: item.dictLabel});
+          });
+          this.sexValue = this.selectDictLabel(res.data, response.data.tHouseApplyProposer.sex);
+        });
+        //建房类型字典查询
+        this.houseGetDicts("building_type").then((res) => {
+          res.data.map(item => {
+            this.buildingType.push({ value:item.dictValue, text: item.dictLabel});
+          });
+          this.buildingTypeValue = this.selectDictLabel(res.data, response.data.tHouseApplyProposedSituation.buildingType);
+        });
+        //房屋构造字典查询
+        this.houseGetDicts("housing_structure").then((res) => {
+          res.data.map(item => {
+            this.housingStructure.push({ value:item.dictValue, text: item.dictLabel});
+          });
+          this.housingStructureValue = this.selectDictLabel(res.data, response.data.tHouseApplyProposedSituation.housingStructure);
+        });
+        //处置情况字典查询
+        if(response.data.tHouseApplyProposer.existHomestead == 'Y'){
+          this.CurrentSituation = true ;
+          this.houseGetDicts("land_isposal").then((res) => {
+            res.data.map(item => {
+              this.landIsposal.push({ value:item.dictValue, text: item.dictLabel});
+            });
+            this.landIsposalValue= this.selectDictLabel(res.data, response.data.tHouseApplyCurrentSituation.landIsposal);
+          });
+        }
+        //户型图查询
+        houseList().then(res => {
+          res.rows.map(item => {
+            this.houseType.push({ value:item.id, text: item.name});
+          });
+          if(response.data.tHouseApplyProposedSituation.houseTypeId != null){
+            for (let i = 0 ; i < res.rows.length ; i++){
+              if (res.rows[i].id = response.data.tHouseApplyProposedSituation.houseTypeId){
+                this.houseTypeValue = res.rows[i].name
+              }
+            }
+            this.showHouse = true;
+          }
+        });
+        console.log(response.data.tHouseApplyProposer.auditStatus != 0)
+        this.applicationDetail = response.data;
+        this.parameter.houseApplyStatus = response.data.tHouseApplyProposer.houseApplyStatus;
+        let currentProcessKey = response.data.currentProcessKey;
+        this.auditStatus =  response.data.tHouseApplyProposer.auditStatus != 0;
+        //判断当前审核进行到哪一步
+        if (currentProcessKey == 'baseApply'){
+          this.active = 0;
+        }
+        if (currentProcessKey == 'landscope'){
+          this.active = 1;
+        }
+        if (currentProcessKey == 'accepting'){
+          this.active = 2;
+        }
+        //获取上传文件列表
+        treeSingleProcessView(this.parameter).then(res => {
+          this.fileArray = res.rows
+          this.params.tableId = this.id;
+          for (let i = 0 ; i < res.rows.length ; i++){
+            this.params.fileType = res.rows[i].fileType;
+            this.fileArray[i].findList = [];
+            //获取文件集合
+            attachmentFind(this.params).then(res2 => {
+              for (let j = 0 ; j < res2.data.length ; j++){
+                this.fileArray[i].findList[j] = {url: process.env.VUE_APP_BASE_ROUTING_URL + res2.data[j].fileUrl, isImage: true , id:res2.data[j].id} ;
+                this.$forceUpdate();
+                console.log(this.fileArray[i].findList[j])
+              }
+            });
+          }
+        });
+        var that = this ;
+        setTimeout(function(){
+          that.pointDarw();
+        },2000)
+      });
+    },
+    onConfirmApplyTime(date) {
+      this.applicationDetail.tHouseApplyProposer.applyTime = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
+      this.showApplyTime = false;
+    },
+    //基地开工时间
+    onConfirmStartDate(date) {
+      this.applicationDetail.tHouseApplyStart.startDate = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
+      this.showStartDate = false;
+    },
+    //基地竣工时间
+    onConfirmEndDate(date) {
+      this.applicationDetail.tHouseApplyStart.endDate = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
+      this.showEndDate = false;
+    },
+    //选择建房类型
+    onConfirmBuildingType(data){
+      this.buildingTypeValue = data.text;
+      this.applicationDetail.tHouseApplyProposedSituation.buildingType = data.value;
+      this.showBuildingType = false;
+    },
+    //选择宅基地处置情况
+    onConfirmLandIsposal(data){
+      this.landIsposalValue = data.text;
+      this.applicationDetail.tHouseApplyCurrentSituation.landIsposal = data.value;
+      this.showLandIsposal = false;
+    },
+    //选择房屋构造
+    onConfirmHousingStructure(data){
+      this.housingStructureValue = data.text;
+      this.applicationDetail.tHouseApplyProposedSituation.housingStructure = data.value;
+      this.showHousingStructure = false;
+    },
+    //选择户型
+    onConfirmHouseType(data){
+      this.houseTypeValue = data.text;
+      this.applicationDetail.tHouseApplyProposedSituation.houseTypeId = data.value;
+      this.showHouseType = false;
+    },
+    //选择性别
+    onConfirmSex(data){
+      this.sexValue = data.text;
+      this.applicationDetail.tHouseApplyProposer.sex = data.value;
+      this.showSex = false;
+    },
+    //添加家庭成员
+    addFamily(){
+      this.applicationDetail.tHouseApplyFamilyMembers.push({
+        applyProposerId:this.applicationDetail.tHouseApplyFamilyMembers[0].applyProposerId,
+        memberName:'',
+        age:'',
+        familyStatusName:'',
+        idcard :'',
+        householdRegister:'',
+      });
+    },
+    //删除家庭成员
+    deleteFamily(index){
+      this.applicationDetail.tHouseApplyFamilyMembers.splice(index,1)
+    },
+    //是否有宅基地选项改变
+    existHomesteadChange(name){
+      if (name == 'Y'){
+        if (this.applicationDetail.tHouseApplyCurrentSituation == null){
+          //现宅基地情况
+          this.applicationDetail.tHouseApplyCurrentSituation = {
+            //宅基地面积
+            landArea: '',
+            //人均宅基地面积
+            landPerArea: '',
+            //不动产单元号
+            landCertificateNo: '',
+            //农民房屋幢号
+            houseCertificateNo: '',
+            //建筑面积
+            buildingArea: '',
+            //人均建筑面积
+            buildingPerArea: '',
+            //现宅基地处置情况 字典 land_isposal
+            landIsposal: ""
+          };
+          this.CurrentSituation = true ;
+          //处置情况字典查询
+          this.houseGetDicts("land_isposal").then((res) => {
+            res.data.map(item => {
+              this.landIsposal.push({ value:item.dictValue, text: item.dictLabel});
+            });
+            this.landIsposalValue= this.selectDictLabel(res.data, this.applicationDetail.tHouseApplyCurrentSituation.landIsposal);
+          });
+        }
+        this.CurrentSituation = true;
+      }else{
+        this.CurrentSituation = false;
+      }
+    },
+    //图纸选择改变
+    designPaperChange(name){
+      if(name == 2){
+        this.showHouse = true;
+      }else{
+        this.showHouse = false;
+      }
+    },
+    base64toFile(dataurl, filename = "file") {
+      let arr = dataurl.split(",");
+      let mime = arr[0].match(/:(.*?);/)[1];
+      let suffix = mime.split("/")[1];
+      let bstr = atob(arr[1]);
+      let n = bstr.length;
+      let u8arr = new Uint8Array(n);
+      while (n--) {
+        u8arr[n] = bstr.charCodeAt(n);
+      }
+      return new File([u8arr], `${filename}.${suffix}`, {
+        type: mime,
+      });
+    },
+    //申请提交
+    onSubmit(type){
+      var that = this;
+      let form = {};
+      form.fileList=[];
+      this.fileList.tableId = this.id;
+      if (this.drawInsert != null) {
+        this.applicationDetail.tHouseApplyProposedSituation.theGeom = JSON.stringify(this.drawInsert);
+      }
+      for (let i = 0 ; i < this.fileArray.length ; i++){
+        if (this.fileArray[i].findList == null || this.fileArray[i].findList == undefined || this.fileArray[i].findList == ''){
+          continue
+        }
+        for (let j = 0 ; j < this.fileArray[i].findList.length ; j++){
+          const params = new FormData()
+          params.append('tableId', this.id)
+          params.append('tableName', 't_house_apply_proposer')
+          params.append('bizPath', 't_house_apply_proposer')
+          params.append('fileType', this.fileArray[i].fileType)
+          if (this.fileArray[i].findList[j].url){
+            continue;
+          }
+          params.append('file', this.base64toFile(this.fileArray[i].findList[j].content))
+          attach(params).then(res => {
+            form.fileList.push(res.id);
+          });
+        }
+      }
+      form.tHouseApplyProposer=this.applicationDetail.tHouseApplyProposer;
+      form.tHouseApplyFamilyMembers=this.applicationDetail.tHouseApplyFamilyMembers;
+      form.tHouseApproveVillageOptions=this.applicationDetail.tHouseApproveVillageOptions;
+      form.tHouseApplyCurrentSituation=this.applicationDetail.tHouseApplyCurrentSituation;
+      form.tHouseApplyProposedSituation=this.applicationDetail.tHouseApplyProposedSituation;
+      setTimeout(function(){
+        if (type == 'keep'){
+          saveHouseBaseInfo(form).then(res => {
+            if(res.code = 200){
+              that.$toast.success('保存成功');
+            }
+          });
+        }
+        if (type == 'submit'){
+          saveHouseBaseInfoThenSubmit(form).then(res => {
+            if(res.code = 200){
+              that.$toast.success('提交成功');
+              that.getDetail();
+            }
+          });
+        }
+
+      },1000)
+
+    },
+    pointDarw() {
+      //地图只加载一次
+      this.landOpen = false;
+      //加载地图编辑
+      var that = this;
+      var map;
+      //var hc_land;
+      var draw; // global so we can remove it later
+      var vector_drawing;
+      var minMapZoom;
+      var maxMapZoom;
+      var zoomLook;
+      if (this.formEditor) {
+        zoomLook = 18
+        minMapZoom = 18
+        maxMapZoom = 18
+      } else {
+        zoomLook = 16.9
+        minMapZoom = 16
+        maxMapZoom = 18.9
+      }
+      if (this.applicationDetail.tHouseApplyProposedSituation.theGeom != null && this.applicationDetail.tHouseApplyProposedSituation.theGeom != ""
+        && this.applicationDetail.tHouseApplyProposedSituation.theGeom != undefined) {
+        this.startDarw = true;
+        this.openDarw = false;
+      } else {
+        this.startDarw = false;
+        this.openDarw = true;
+      }
+      if (this.startDarw) {
+        document.getElementById("mapWrap").innerHTML = '';
+        var hc_land;
+        var draw; // global so we can remove it later
+        var vector_drawing;
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //加载地图
+        map = new ol.Map({
+          // interactions: ol.interaction.DragPan({
+          //   onFocusOnly: false
+          // }),
+          controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+          layers: [aerial, yingxzi],
+          projection: projection,
+          target: "mapWrap",
+          view: new ol.View({
+            //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+            zoom: zoomLook,
+            minZoom: minMapZoom, //地图缩小限制
+            maxZoom: maxMapZoom, //地图放大限制
+          }),
+        });
+        if (this.formEditor) {
+          let pan = getPan();
+          //false：当前地图不可拖动。true：可拖动
+          pan.setActive(false);
+
+          function getPan() {
+            let pan = '';
+            map.getInteractions().forEach(function (element, index, array) {
+              if (element instanceof ol.interaction.DragPan) {
+                pan = element;
+              }
+            })
+            return pan;
+          }
+        }
+        //图层查询定位开始 ---------start
+        hc_land = new ol.layer.Vector({
+          title: "add Layer",
+          source: new ol.source.Vector({
+            projection: projection,
+            features: new ol.format.GeoJSON().readFeatures("{\n" +
+              "    \"type\": \"Feature\",\n" +
+              "    \"geometry\":" + this.applicationDetail.tHouseApplyProposedSituation.theGeom + "}"),
+          }),
+          style: new ol.style.Style({
+            fill: new ol.style.Fill({
+              //矢量图层填充颜色，以及透明度
+              color: "rgba(204, 255, 204,0.3)",
+            }),
+            stroke: new ol.style.Stroke({
+              //边界样式
+              color: "#47c68f",
+              width: 3,
+            }),
+          }),
+        });
+        map.addLayer(hc_land);
+        var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
+        var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
+        var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
+        var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
+        //定位查询位置
+        var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
+        map.getView().animate({
+          // 只设置需要的属性即可
+          center: center, // 中心点
+          zoom: 17.9, // 缩放级别
+          rotation: undefined, // 缩放完成view视图旋转弧度
+          duration: 1000, // 缩放持续时间，默认不需要设置
+        });
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#drawPolygon").click(function () {
+          map.removeLayer(hc_land);
+          map.removeLayer(vector_drawing);
+          that.drawInsert = null;
+          map.removeInteraction(draw);
+          var source = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: source,
+          });
+          map.addLayer(vector_drawing);
+          var typeSelect = "Polygon";
+
+          function addInteraction() {
+            var value = typeSelect;
+            draw = new ol.interaction.Draw({
+              source: source,
+              type: typeSelect
+            });
+            draw.on('drawend', function (evt) {
+              console.log(that.drawInsert);
+              if(that.drawInsert != null){
+                $("#drawRemove").trigger('click');
+              }
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              that.drawInsert = coordinate;
+              map.removeInteraction(draw);
+            });
+            map.addInteraction(draw);
+          }
+          addInteraction();
+        });
+        //清除画图鼠标点击事件
+        $("#drawRemove").click(function () {
+          that.drawInsert = null;
+          map.addLayer(hc_land);
+          map.removeInteraction(draw);
+          map.removeLayer(vector_drawing);
+        });
+      }
+      if (this.openDarw) {
+        document.getElementById("mapWrap").innerHTML = '';
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //获取坐标是否存在
+        var Zb;
+        if (this.tGeoOrganizationLng != null && this.tGeoOrganizationLat != null) {
+          Zb = [this.tGeoOrganizationLng, this.tGeoOrganizationLat]
+        } else {
+          Zb = [115.452752, 31.789033];
+        }
+        //加载地图
+        map = new ol.Map({
+          controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+          layers: [aerial, yingxzi],
+          projection: projection,
+          logo: 'false',
+          target: "mapWrap",
+          view: new ol.View({
+            center: ol.proj.fromLonLat(Zb),
+            //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+            zoom: 16.9,
+            minZoom: minMapZoom, //地图缩小限制
+            maxZoom: maxMapZoom, //地图放大限制
+          }),
+        });
+
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#drawPolygon").click(function () {
+          //map.removeLayer(hc_land);
+          map.removeLayer(vector_drawing);
+          that.drawInsert = null;
+          map.removeInteraction(draw);
+          var source = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: source,
+          });
+          map.addLayer(vector_drawing);
+          var typeSelect = "Polygon";
+
+          function addInteraction() {
+            var value = typeSelect;
+            draw = new ol.interaction.Draw({
+              source: source,
+              type: typeSelect
+            });
+            draw.on('drawend', function (evt) {
+              console.log(that.drawInsert);
+              if(that.drawInsert != null){
+                $("#drawRemove").trigger('click');
+              }
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              that.drawInsert = coordinate;
+              map.removeInteraction(draw);
+            });
+            map.addInteraction(draw);
+          }
+          addInteraction();
+        });
+        //清除画图鼠标点击事件
+        $("#drawRemove").click(function () {
+          that.drawInsert = null;
+          map.removeInteraction(draw);
+          map.removeLayer(vector_drawing);
+        });
+      }
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding-bottom: 5%;
+  }
+  .examine_box{
+    background-color: #1D6FE9!important;
+    padding: 0.18rem!important;
+    padding-left: 0!important;
+    border-radius: 0.15rem!important;
+    margin-top: 0.3rem!important;
+  }
+  .examine_box .van-col:first-child{
+    color: #FFF!important;
+    font-size: 0.45rem!important;
+    text-align: center!important;
+  }
+  .examine_box .van-col:last-child{
+    background-color: #FFF!important;
+    border-radius: 0.15rem!important;
+    overflow: hidden!important;
+    .van-radio-group--horizontal{
+      padding: 0.2rem 0;
+      border-bottom: 1px solid #eee;
+    }
+  }
+  #mapWrap{
+    width: 96%;
+    margin: 0 auto;
+    border-bottom-left-radius: 12px;
+    border-bottom-right-radius: 12px;
+    overflow: hidden;
+  }
+  .mapBox{
+    position: relative;
+    .mapBox_button{
+      position: absolute;
+      top: 0.2rem;
+      right: 2%;
+    }
+  }
+  .van-steps{
+    padding: 2% 6% 0;
+  }
+  .topTit{
+    margin-top: 0.4rem;
+    font-size: 0.45rem;
+    background-color: #1D6FE9;
+    color: #FFFFFF;
+    line-height: 58px;
+    text-align: center;
+    padding: 15px 0;
+    box-shadow: 0px 3px 6px 0px rgba(15,67,145,0.40);
+  }
+  .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;
+  }
+  .collapse{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    margin-bottom: 15px;
+  }
+  /deep/.van-radio--horizontal{
+    margin-left: 20px;
+    margin-right: 0;
+  }
+  .file-box{
+    padding: 2% 5% 0;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+    border-radius: 14px;
+  }
+  .timeTit{
+    text-align: center;
+    font-size: 16px;
+    line-height: 27px;
+  }
+  .action-box{
+    padding: 15px 0!important;
+    margin-top: 0.4rem;
+  }
+  .check-box{
+    margin-top: 0.4rem;
+  }
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+  .deleteFamily{
+    position: absolute;
+    top: -0.3rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
+  .familyList{
+    margin-top: 0.4rem;
+    position: relative;
+  }
+  .noModify{
+    .topTit{
+      background-color:#ABABAB ;
+      box-shadow: 0px 3px 6px 0px rgba(171,171,171,0.40);
+    }
+    .van-cell__title{
+      color: #B4B0B0;
+    }
+  }
+</style>