<template>
    <div class="app-container">
<!--      <van-nav-bar-->
<!--        left-arrow-->
<!--        fixed-->
<!--        placeholder-->
<!--        @click-left="$router.back(-1)"-->
<!--      >-->
<!--        <template #title>-->
<!--          <p style="font-weight: bold;">添加有偿退出</p>-->
<!--        </template>-->
<!--      </van-nav-bar>-->

      <div class="header_main">
        添加有偿退出
        <div class="return_btn" @click="onClickLeft"></div>
        <!--      <div class="add_btn" @click="goAdd"></div>-->
      </div>

      <p class="main_title">申请人基本信息</p>
      <van-form ref="_Form">
      <div class="main_box">
<!--        <van-field v-model="circulation.sqrxm" label="申请人姓名" placeholder="申请人姓名" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>-->
        <van-field v-model="circulation.sqrxm" label="申请人姓名" placeholder="申请人姓名" input-align="right" label-width="auto" :rules="[{ required: true }]" required @input="remoteTransfereeMethod" />
        <div id="dropList" v-show="showDropList"  style="width: 92vw; position: absolute; z-index: 99; left: 50%; margin-left: -46vw; border: 1px solid #E2E0E0;" >
          <van-cell id="vanCell"  v-for="(item, index) in getObligeeOptions" :key="index" @click="shyqrdmxmChange(item)" style="position: relative; z-index: 999;">
            {{item.sqrxm}}
          </van-cell>
        </div>
<!--        <van-field-->
<!--          readonly-->
<!--          clickable-->
<!--          v-model="circulation.zjddm"-->
<!--          label="宅基地代码"-->
<!--          placeholder="请选择"-->
<!--          @click="remoteProposerMethod"-->
<!--          input-align="right"-->
<!--          right-icon="arrow-down" :rules="[{ required: true }]" required-->
<!--        />-->
<!--        <van-popup v-model="showzjddm" position="bottom">-->
<!--          <van-picker-->
<!--            show-toolbar-->
<!--            :columns="zjdDictionaries"-->
<!--            value-key="zjddm"-->
<!--            @confirm="onConfirmZjddm"-->
<!--            @cancel="showzjddm = false"-->
<!--          />-->
<!--        </van-popup>-->
        <van-field
          v-model="circulation.zjddm"
          label="宅基地代码"
          input-align="right"
        >
          <template #button>
            <van-icon name="../../../static/images/22.png"  color="#539FFD" size="20" @click="mapLook"/>
          </template>
        </van-field>
        <van-field
          readonly
          clickable
          v-model="xb"
          label="性别"
          placeholder="请选择"
          @click="showxb = true"
          input-align="right"
          right-icon="arrow-down"
          label-width="auto" :rules="[{ required: true }]" required
        />
        <van-popup v-model="showxb" position="bottom">
          <van-picker
            show-toolbar
            :columns="xbDictionaries"
            @confirm="onConfirmXb"
            @cancel="showxb = false"
          />
        </van-popup>
        <van-field v-model="circulation.sqrzjhm" label="申请人证件号码" placeholder="申请人证件号码" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
        <van-field v-model="circulation.lxdh" label="联系电话" placeholder="联系电话" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
        <field-select
          v-model="circulation.gyqk"
          label="共有情况"
          value-key="dictLabel"
          data-key="dictValue"
          placeholder="选择共有情况"
          :rules="[{ required: true }]"
          required
          remote-url="/open/zdzh/list/house_yes_no"
          :on-remote-response="'data'"
        />
        <van-field v-model="circulation.hkszd" label="户口所在地" placeholder="户口所在地" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
      </div>

        <p class="main_title">拟申请退出宅基地</p>
        <van-field v-model="circulation.tcmj" label="面积(㎡)" placeholder="请输入面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>
        <field-select
          v-model="circulation.xz"
          label="现状"
          value-key="dictLabel"
          data-key="dictValue"
          placeholder="选择现状"
          :rules="[{ required: true }]"
          required
          remote-url="/open/zdzh/list/dsxz"
          :on-remote-response="'data'"
        />
        <van-field v-model="circulation.zjdszd" label="东至" placeholder="东至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
        <van-field v-model="circulation.zjdszn" label="南至" placeholder="南至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
        <van-field v-model="circulation.zjdszx" label="西至" placeholder="西至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
        <van-field v-model="circulation.zjdszb" label="北至" placeholder="北至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
        <field-select
          v-model="circulation.dldm"
          label="地类"
          value-key="dictLabel"
          data-key="dictValue"
          placeholder="选择现状"
          :rules="[{ required: true }]"
          required
          remote-url="/open/zdzh/list/geographic_type"
          :on-remote-response="'data'"
        />
        <p class="main_title">退出宅基地情况</p>
        <van-field v-model="circulation.tcmj" label="退出面积(㎡)" placeholder="请输入退出面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>
        <van-field v-model="circulation.jzmj" label="建筑面积(㎡)" placeholder="请输入建筑面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>
      <div class="main_box">
        <van-field
          readonly
          clickable
          v-model="tcqllx"
          label="退出权利类型"
          placeholder="请选择退出权利类型"
          @click="showtcqllx = true"
          input-align="right"
          right-icon="arrow-down"
          label-width="auto" :rules="[{ required: true }]" required
        />
        <van-popup v-model="showtcqllx" position="bottom">
          <van-picker
            show-toolbar
            :columns="tcqllxDictionaries"
            @confirm="onConfirmTcqllx"
            @cancel="showtcqllx = false"
          />
        </van-popup>

        <!--<van-field
          readonly
          clickable
          v-model="tclx"
          label="退出类型"
          placeholder="请选择退出类型"
          @click="showtclx = true"
          input-align="right"
          right-icon="arrow-down"
          label-width="auto" :rules="[{ required: true }]" required
        />
        <van-popup v-model="showtclx" position="bottom">
          <van-picker
            show-toolbar
            :columns="tclxDictionaries"
            @confirm="onConfirmTclx"
            @cancel="showtclx = false"
          />
        </van-popup>-->

        <van-field
          readonly
          clickable
          v-model="tcfs"
          label="退出方式"
          placeholder="请选择退出方式"
          @click="showtcfs = true"
          input-align="right"
          right-icon="arrow-down"
          label-width="auto" :rules="[{ required: true }]" required
        />
        <van-popup v-model="showtcfs" position="bottom">
          <van-picker
            show-toolbar
            :columns="tcfsDictionaries"
            @confirm="onConfirmTcfs"
            @cancel="showtcfs = false"
          />
        </van-popup>
        <van-field v-model="circulation.tcqszsh" label="权属证书号" placeholder="请输入权属证书号" input-align="right" label-width="auto" />
      </div>
        <p class="main_title">现居住情况</p>
        <van-field v-model="circulation.xjzmj" label="建筑面积(㎡)" placeholder="请输入建筑面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>
        <van-field v-model="circulation.xqszsh" label="权属证书号" placeholder="请输入权属证书号" input-align="right" label-width="auto" />
        <van-field v-model="circulation.xjzdd" label="居住地点" placeholder="请输入居住地点" input-align="right" label-width="auto" />
        <p class="main_title">补偿信息</p>
        <van-field v-model="circulation.bcje" label="宅基地补偿" placeholder="宅基地补偿" input-align="right" label-width="auto"  type="number"/>
        <van-field v-model="circulation.dmfzwbc" label="地面附着物补偿" placeholder="地面附着物补偿" input-align="right" label-width="auto"  type="number"/>
        <field-select
          v-model="circulation.yctcfs"
          label="退出类型"
          value-key="dictLabel"
          data-key="dictValue"
          placeholder="选择退出类型"
          remote-url="/open/zdzh/list/yctcfs"
          :on-remote-response="'data'"
        />
        <field-select
          v-model="circulation.bcfs"
          label="补偿方式"
          value-key="dictLabel"
          data-key="dictValue"
          placeholder="选择退出类型"
          remote-url="/open/zdzh/list/bcfs"
          :on-remote-response="'data'"
        />
        <field-date-picker
          v-model="circulation.bcsj"
          label="补偿时间"
          placeholder="选择日期"
          formatter="yyyy-MM-dd"
        />
        <p class="main_title">其他</p>

        <van-field v-model="circulation.sqly" label="申请理由" placeholder="请输入申请理由" input-align="right" label-width="auto"/>
        <field-date-picker
          v-model="circulation.sqrq"
          label="申请日期"
          placeholder="选择日期"
          :rules="[{ required: true }]"
          formatter="yyyy-MM-dd"
          required
        />
        <van-field v-model="circulation.jbrxm" label="经办人姓名" placeholder="请输入经办人姓名" input-align="right" label-width="auto"/>
        <field-date-picker
          v-model="circulation.pzrq"
          label="批准日期"
          placeholder="选择日期"
          :rules="[{ required: true }]"
          formatter="yyyy-MM-dd"
          required
        />
        <field-date-picker
          v-model="circulation.barq"
          label="备案日期"
          placeholder="选择日期"
          :rules="[{ required: true }]"
          formatter="yyyy-MM-dd"
          required
        />

        <van-dialog v-model="mapShow" show-cancel-button>
          <MapGisObtainTc ref="zjdProductResh" :shqrxm="circulation.sqrxm" :landStatus="landStatus" :deptId="sysFarmer.deptId" @closeMoule="closeMoule"></MapGisObtainTc>
        </van-dialog>
        <!-- 3组附件 -->
        <van-popup
          v-model="attachmentVisible"
          closeable
          position="top"
          :style="{ height: '61.8%' }"
          :close-on-click-overlay="proposerStatus == 1"
          :lazy-render="false"
        >
          <van-tabs type="card" style="padding-top: 1.35rem;" color="#1D6FE9" :lazy-render="false" v-model="attachmentActive" ref="attachmentDialog">
            <van-tab title="退出附件" key="0">
              <home-apply-upload-comp
                :business-type="houseApplyUploadComp.businessType"
                :house-apply-status="houseApplyUploadComp.homeApplyStatus"
                :process-key="houseApplyUploadComp.processKey"
                :proposer-id="houseApplyUploadComp.proposerId"
                :table-name="houseApplyUploadComp.tableName"
                :readonly="houseApplyUploadComp.readonly"
                :userName="sysFarmer.memberName"
                :full="houseApplyUploadComp.full"
                @uploadFinished="onUploadFinished"
              >
              </home-apply-upload-comp>
            </van-tab>
          </van-tabs>
        </van-popup>
      </van-form>
      <van-goods-action style="z-index: 999;">
        <van-goods-action-icon icon="label-o" text="附件" @click="openAttachment" color="#1D6FE9" />
          <van-goods-action-button type="info" text="保存"  @click="goSubmit(false)" />
          <van-goods-action-button type="info" text="提交"  @click="goSubmit(true)"/>
      </van-goods-action>
    </div>
</template>

<script>
import {  getShyqrs,dyAdd,zyyctcApply,getByLyZjddm,listHomesteadnmfw} from "@/api/sunVillage_info/homestead/paidExit";
import HomeApplyUploadComp from "@/components/home/HomeApplyUploadComp";
import FieldSelect from "@/components/form/FieldSelect";
import FieldDatePicker from "@/components/form/FieldDatePicker";
import {formatDate} from "element-ui/src/utils/date-util.js";
import { } from "@/api/onlineHome/homestead/paidExit";
import {Notify} from "vant";
import MapGisObtainTc from "@/components/Map/MapGisObtainTc";
import Cookies from "js-cookie";
const PROPOSER_VIEW = 1;
// 工作流名称
const PROPOSER_STAGE_BASE_APPLY_ACTIVITY = 'home_usetc';
// 附件表名
const PROPOSER_STAGE_BASE_APPLY_TABLE = 't_homeuse_zyyctc';
// 其他
const PROPOSER_MODULE = 'home';
export default {
  name: "paidExitAdd",
  components: { MapGisObtainTc,FieldSelect,FieldDatePicker,HomeApplyUploadComp },
  data() {
    return {
      tcqllxDictionaries:[],//退出权利类型
      tclxDictionaries:[],//退出类型
      tcfsDictionaries:[],//退出方式
      yctcfsDictionaries:[],//有偿退出方式
      xbDictionaries:[],//申请人证件类型
      bcfsDictionaries:[],//补偿方式
      zjdDictionaries:[],//宅基地代码
      getObligeeOptions:[],//下拉框列表
      sysFarmer:JSON.parse(Cookies.get('user')),
      tcqllx:'整体退出',
      tclx:'有偿退出',
      tcfs:'使用权',
      yctcfs:'暂时退出',
      xb:'男',
      bcfs:'',
      zjddm:'',
      landStatus:"1",
      showtcqllx: false,
      showtclx: false,
      showtcfs: false,
      showyctcfs: false,
      showxb: false,
      showbcfs: false,
      showzjddm: false,
      showDropList: false,//是否显示下拉框
      attachmentVisible:false,
      active: 0,
      // 表单意图
      proposerStatus: PROPOSER_VIEW,
      // 家庭成员tab
      familyMembersActive: 0,
      circulation:{
        // 申请类型  1-宅基地退出
        sqlx: '1',
        xb:"1",
        gyqk:"1",
        xz:"1",
        tcfs:"01",
        jzmj:0.00,
        tcqllx:"01",
        xjzmj:0.00,
        dldm:"10",
        // 退出类型  01-有偿退出   02-无偿退出
        tclx: '01',
      },
      // 当前附件tab
      attachmentActive: 0,
      // 申请附件树
      houseApplyUploadComp: {
        businessType: PROPOSER_MODULE,
        proposerId: -1,
        homeApplyStatus: "11",
        processKey: PROPOSER_STAGE_BASE_APPLY_ACTIVITY,
        tableName: PROPOSER_STAGE_BASE_APPLY_TABLE,
        attachmentList: [],
        readonly: false,
        full: false,
      },
      mapShow: false,
    };
  },
  created() {
    this.getDictionaries();
    getShyqrs({shyqrdbzjhm:this.sysFarmer.idcard,status:1}).then((response) => {
      if (response.code == 200) {
        this.shyqrdmxmChange(response.rows[0]);
        this.closeMoule(response.rows[0].zjddm);
      }
    });
  },
  methods: {
    getDictionaries(){
      //退出权利类型
      this.houseGetDicts("tcqllx").then((res) => {
        for(var i = 0 ; i < res.data.length ; i++){
          this.tcqllxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
        }
      });
      //退出类型
      /*this.houseGetDicts("tclx").then((res) => {
        for(var i = 0 ; i < res.data.length ; i++){
          this.tclxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
        }
      });*/
      //退出方式
      this.houseGetDicts("tcfs").then((res) => {
        for(var i = 0 ; i < res.data.length ; i++){
          this.tcfsDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
        }
      });
      //申请人证件类型
      this.houseGetDicts("sys_user_sex").then((res) => {
        for(var i = 0 ; i < res.data.length ; i++){
          this.xbDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
        }
      });
      //补偿方式
      this.houseGetDicts("bcfs").then((res) => {
        for(var i = 0 ; i < res.data.length ; i++){
          this.bcfsDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
        }
      });
      this.$set(this.circulation, 'yctcfs', "1");
      this.$set(this.circulation, 'bcfs', "01");
      this.$set(this.circulation, 'bcje', 0.00);
      this.$set(this.circulation, 'dmfzwbc', 0.00);
      //宅基地代码
      /*zjdzd().then(zjdRes => {
        for( let i = 0 ; i < zjdRes.rows.length ; i++){
          this.zjdDictionaries.push(zjdRes.rows[i].zjddm);
        }
        if(this.zjdDictionaries.length > 0)
          this.onConfirmZjddm(this.zjdDictionaries[0]);
      });*/
      // getExitProposerDetail().then(res => {
      //   if (res.data) {
      //     let data = res.data;
      //     this.$set(this.circulation, 'sqrxm', data.shyqrdbxm);
      //     this.$set(this.circulation, 'sqrzjhm', data.shyqrdbzjhm);
      //     this.$set(this.circulation, 'sqrzjlx', data.shyqrdbzjlx);
      //     if(data.shyqrdbzjlx) {
      //       let val = this.zjlxDictionaries.find((x) => x.value == data.shyqrdbzjlx);
      //       if(val)
      //         this.zjlx = val.text;
      //     }
      //   }
      // });
    },
    /*onConfirmZjddm(data){
      console.log(data)
      this.circulation.zjddm = data;
      this.showzjddm = false;
      getByZjddm({zjddm: data,}).then(qlrRes => {
        let data = qlrRes.data;
        console.log(data)
        this.$set(this.circulation, 'sqrxm', data.shyqrdbxm);
        this.$set(this.circulation, 'sqrzjhm', data.shyqrdbzjhm);
        this.$set(this.circulation, 'sqrzjlx', data.shyqrdbzjlx);
        if(data.shyqrdbzjlx)
        {
          let val = this.zjlxDictionaries.find((x) => x.value == data.shyqrdbzjlx);
          if(val)
            this.zjlx = val.text;
        }
        this.$forceUpdate();
      });
    },*/
    // 初次申请草稿的附件上传
    onUploadFinished(fileIdList) {
      this.$set(this.circulation, "fileList", fileIdList);
    },
    onConfirmZjddm(data){
      console.log(data);
      this.showzjddm = false;
      if (data) {
        this.$set(this.circulation, 'zjddm', data.zjddm);
        this.$set(this.circulation, 'sqrzjhm', data.shyqrdbzjhm);
        this.$set(this.circulation, 'sqrzjlx', data.shyqrdbzjlx);
        if(data.shyqrdbzjlx)
        {
          let val = this.zjlxDictionaries.find((x) => x.value == data.shyqrdbzjlx);
          if(val)
            this.zjlx = val.text;
        }
      }
      // this.$forceUpdate();
    },
    onConfirmXb(data){
      this.xb = data.text;
      this.circulation.xb = data.value;
      this.showxb = false;
    },
    onConfirmTcqllx(data){
      this.tcqllx = data.text;
      this.circulation.tcqllx = data.value;
      this.showtcqllx = false;
    },
    /*onConfirmTclx(data){
      this.tclx = data.text;
      this.circulation.tclx = data.value;
      this.showtclx = false;
    },*/
    onConfirmTcfs(data){
      this.tcfs = data.text;
      this.circulation.tcfs = data.value;
      this.showtcfs = false;
    },
    onConfirmYctcfs(data){
      this.yctcfs = data.text;
      this.circulation.yctcfs = data.value;
      this.showyctcfs = false;
    },
    onConfirmBcfs(data){
      this.bcfs = data.text;
      this.circulation.bcfs = data.value;
      this.showbcfs = false;
    },
    goSubmit(submit){
      console.log(this.circulation);
      this.$refs._Form.validate().then(() => {
        // 设置初始状态为草稿，0 代表草稿
        this.$set(this.circulation, "auditStatus", '0');
      dyAdd(this.circulation).then(response => {
        if(response.code = 200){
          if(submit)
          {
            zyyctcApply(response.data).then((resp) => {
              this.$toast.success('提交成功');
              this.back();
            });
          }
          else {
            this.$toast.success('保存成功');
            this.back();
          }
        }
      })
      }).catch((e) => {
        Notify({ type: 'danger', message: '请填写完整的表单项' });
      });
    },
    back() {
      setTimeout(() => this.$router.back(-1), 1000)
    },
    remoteProposerMethod() {
      this.showzjddm = true;
      this.zjdDictionaries = [];
      if (this.circulation.sqrxm) {
        getShyqrs({shyqrdbxm:this.circulation.sqrxm}).then(response => {
          this.zjdDictionaries = response.data.map(item => {
            return {
              zjddm: item.zjddm,
              shyqrdbxm: item.shyqrdbxm,
              shyqrdbzjlx: item.shyqrdbzjlx,
              shyqrdbzjhm: item.shyqrdbzjhm
            }
          });
        });
      } else {
        this.zjdDictionaries = [];
      }
    },
    /** 模糊查询人员信息 */
    remoteTransfereeMethod(query) {
      if (query !== "") {
        getShyqrs({shyqrdbxm:query,status:1}).then((response) => {
          if (response.code == 200) {
            this.getObligeeOptions = response.rows.map(function (item) {
            return {
                      sqrxm:item.shyqrdbxm,
                      sqrxb:item.xb,
                      sqrzjhm:item.shyqrdbzjhm,
                      sqrnhdm:item.nhdm,
                      sqrzjlx:item.shyqrdbzjlx,
                      sqrdh:item.dh,
                      gyfs:item.gyfs,
                      dz:item.dz,
                      deptId:item.deptId,
                      deptName:item.deptName,
                    }
            })
            //设置模糊查询的下拉框和滚动条
            if (this.getObligeeOptions.length > 0) {
              this.showDropList = true;   // div显示会阻挡下边的选择框和输入框，showDropList控制下拉框是否显示
              //设置模糊查询的和滚动条
              this.$nextTick(() => {
                if (this.getObligeeOptions.length > 4) {
                  let height = document.getElementById("vanCell").offsetHeight * 4;
                  document.getElementById("dropList").style.height = height + "px";
                  document.getElementById("dropList").style.overflow = "scroll";
                } else {
                  document.getElementById("dropList").style.height = "";
                  document.getElementById("dropList").style.overflow = "visible";
                }
              });
            } else {
              this.showDropList = false;
            }
          }
        });
      } else {
        this.getObligeeOptions = [];
        this.showDropList = false;
      }
    },
    // 打开附件树
    openAttachment() {
      this.attachmentVisible = true;
      if(this.attachmentActive == this.active)
        this.$nextTick(() => {
          this.$refs.attachmentDialog.scrollTo(this.active);
        });
    },
    shyqrdmxmChange(val){
      this.$set(this.circulation, "sqrxm", val.shyqrdbxm);
      this.$set(this.circulation, "deptId", val.deptId);
      this.$set(this.circulation, "deptName", val.deptName);
      this.$set(this.circulation, "sqrzjhm", val.shyqrdbzjhm);
      this.$set(this.circulation, "sqrzjlx", val.shyqrdbzjlx);
      this.$set(this.circulation, "sqrnhdm", val.nhdm);
      this.$set(this.circulation, "gyqk", val.gyfs);
      this.$set(this.circulation, "xb", val.xb);
      this.$set(this.circulation, "lxdh", val.dh);
      this.$set(this.circulation, "hkszd", val.dz);
      this.$set(this.circulation, "zjddm", val.zjddm);
      this.getObligeeOptions=[];
      this.showDropList = false;
    },
    mapLook(){
      this.mapShow = true;
      setTimeout(() => {
        this.$refs.zjdProductResh.drawingLyPaceCountryDarw();
      },1000);
    },
    // 获取日期, yyyy-MM-dd
    getDate(d) {
      return formatDate(d ? d : new Date(), 'yyyy-MM-dd');
    },
    /** 查找地图中宅基地 */
    closeMoule: function (data) {
      this.circulation.zjddm = data;
      let _this = this;
      let handlerTime = this.getDate();
      this.$set(this.circulation, "sqrq", handlerTime);
      this.$set(this.circulation, "pzrq", handlerTime);
      this.$set(this.circulation, "barq", handlerTime);
      getByLyZjddm(data).then((response) => {
        this.$set(this.circulation, "ntcmj", response.data.zdmj);
        this.$set(this.circulation, "tcmj", response.data.zdmj);
        this.$set(this.circulation, "zjdszd", response.data.zdszd);
        this.$set(this.circulation, "zjdszn", response.data.zdszn);
        this.$set(this.circulation, "zjdszx", response.data.zdszx);
        this.$set(this.circulation, "zjdszb", response.data.zdszb);
        this.$set(this.circulation, "theGeomJson", response.data.theGeomJson);
        this.$set(this.circulation, "tcqszsh", response.data.zsh);
        listHomesteadnmfw({zjddm: data}).then((res) => {
          res.rows.map(function(item){
            _this.$set(_this.circulation, "jzmj", Number(_this.circulation.jzmj) + Number(item.jzmj));
            _this.$set(_this.circulation, "xjzmj", Number(_this.circulation.xjzmj) + Number(item.jzmj));
          });
        });
        // const baseImgUrl = this.$store.getters.baseRoutingUrl;
        if(response.data.zdt != null && response.data.zdt !== ""){
          this.$set(this.form, "xzzp", response.rows[0].zdt);
        }
      });
    },
  },
}
</script>

<style scoped lang="scss">
  .app-container {
    padding-bottom: 2%;
    .header_main{
      height: 116px;
      background: url('../../../assets/images/sunVillage_info/list_head_green.png') no-repeat;
      background-size: 100% 100%;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      font-size: 36px;
      line-height: 116px;
      text-align: center;
      color: #fff;
      position: relative;
      margin-bottom: 2%;
      .return_btn{
        width: 24px;
        height: 43.2px;
        background: url('../../../assets/images/sunVillage_info/list_icon_5.png') center center no-repeat;
        background-size: 20px 36px;
        position: absolute;
        left: 38px;
        top: 36px;
      }
      .add_btn{
        width: 56.4px;
        height: 40.8px;
        background: url('../../../assets/images/sunVillage_info/list_icon_9.png') center center no-repeat;
        background-size: 47px 34px;
        position: absolute;
        right: 38px;
        top: 36px;
      }
    }
  }
  .main_title{
    font-size: 0.4rem;
    color: #1D6FE9;
    margin: 0.2rem 6%;
    position: relative;
  }
  .main_box{
    width: 96%;
    margin: 0 auto;
    border-radius: 6px;
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
    overflow: hidden;
    background-color: #FFF;
  }
  .submitButton{
    width: 80%;
    margin: 0 auto;
    background-color: #1D6FE9;

  }
  /*#dropList::-webkit-scrollbar {*/
  /*  !*滚动条整体样式*!*/
  /*  width: 5px;     !*高宽分别对应横竖滚动条的尺寸*!*/
  /*  height: 1px;*/
  /*}*/
  /*#dropList::-webkit-scrollbar-thumb {*/
  /*  !*滚动条里面小方块*!*/
  /*  border-radius: 10px;*/
  /*  background: #fff;*/
  /*  box-shadow: inset 0 0 5px rgb(0, 122, 204);*/
  /*}*/
  /*#dropList::-webkit-scrollbar-track {*/
  /*  border-radius: 10px;*/
  /*  background: #fff;*/
  /*  !*滚动条里面轨道*!*/
  /*  box-shadow: inset 0 0 5px rgba( 0, 0, 0, .1);*/
  /*}*/
</style>
