<template>
  <div class="app-container">
    <div class="header_main">
      使用权流转
      <div class="return_btn" @click="onClickLeft"></div>
    </div>
    <p class="main_title">转出方信息</p>
    <div class="main_box">
      <!--        <van-field v-model="circulation.sqrxm" label="申请人姓名" placeholder="申请人姓名" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>-->
      <field-select
        readonly
        v-if="houseOwnershipOpen"
        v-model="circulation.houseOwnership"
        label="转出方归属"
        value-key="dictLabel"
        data-key="dictValue"
        placeholder="请选择"
        :rules="[{ required: true }]"
        required
        @confirm="onConfirmGsf"
        remote-url="/open/zdzh/list/house_ownership  "
        :on-remote-response="'data'"
      />
      <van-field readonly v-if = "shyqxmShow" v-model="circulation.shyqrxm" label="村集体代表姓名"  input-align="right" label-width="auto" :rules="[{ required: true }]" required />
      <van-field readonly v-if = "!shyqxmShow" v-model="circulation.shyqrxm" 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"
        readonly
        label="宅基地代码"
        input-align="right"
      >
        <template #button>
          <van-icon name="../../../../../static/images/22.png"  color="#539FFD" size="20" @click="mapLook"/>
        </template>
      </van-field>
      <field-select
        v-model="circulation.phlyms"
        readonly
        label="盘活利用模式"
        value-key="dictLabel"
        data-key="dictValue"
        placeholder="请选择"
        :rules="[{ required: true }]"
        required
        remote-url="/open/zdzh/list/phlyms  "
        :on-remote-response="'data'"
      />
      <van-field
        readonly
        clickable
        v-model="lzfs"
        label="流转方式"
        placeholder="请选择"
        @click="showLzfs = true"
        input-align="right"
        right-icon="arrow-down" :rules="[{ required: true }]" required
      />
      <van-popup v-model="showLzfs" position="bottom">
        <van-picker
          show-toolbar
          :columns="lzfsDictionaries"
          @confirm="onConfirmLzfs"
          @cancel="showLzfs = false"
        />
      </van-popup>
      <van-field v-if="!xjdShow" v-model="circulation.zcfxjd" label="现居地" placeholder="现居地" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
      <van-field v-if="!zcfhkszdShow" v-model="circulation.zcfhkszd" label="户口所在地" placeholder="户口所在地" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
      <van-cell  v-if="!sfjtjjzzShow" title="是否本集体经济组织成员">
        <template #right-icon>
          <van-radio-group v-model="circulation.zcfsfbjtjjzzcy" direction="horizontal">
            <van-radio name="1">是</van-radio>
            <van-radio name="0">否</van-radio>
          </van-radio-group>
        </template>
      </van-cell>
    </div>
    <p class="main_title">转入方信息</p>
    <div class="main_box">
      <van-field
        v-model="circulation.zrfdbxm"
        label="转入方代表名称"
        placeholder="请输入转入方代表名称"
        label-width="auto"
        input-align="right"
        @input="remoteTransfereeMethodTwo"
      />
      <div id="zrfList" v-show="showZrfList"  style="width: 92vw; position: absolute; z-index: 99; left: 50%; margin-left: -46vw; border: 1px solid #E2E0E0;" >
        <van-cell id="vanCellZrf"  v-for="(item, index) in getZrfObligeeOptions" :key="index" @click="zrfdmxmChange(item)" style="position: relative; z-index: 999;">
          {{item.sqrxm}}
        </van-cell>
      </div>
      <!--          <van-popup v-model="showZrfdbmc" position="bottom">-->
      <!--            <van-picker-->
      <!--              show-toolbar-->
      <!--              :columns="zrfdbmcDictionaries"-->
      <!--              @confirm="onConfirmZrfdbmc"-->
      <!--              @cancel="showZrfdbmc = false"-->
      <!--            />-->
      <!--          </van-popup>-->
      <van-field
        v-model="circulation.zjddm"
        v-if="circulation.lzfs =='03'"
        readonly
        label="宅基地代码"
        input-align="right"
      >
        <template #button>
          <van-icon name="../../../../../static/images/22.png"  color="#539FFD" size="20" @click="hhMapLook"/>
        </template>
      </van-field>
      <field-select
        readonly
        v-model="circulation.zrfdbzjlx"
        label="转入方代表证件类型"
        value-key="dictLabel"
        data-key="dictValue"
        placeholder="请选择"
        :rules="[{ required: true }]"
        required
        remote-url="/open/zdzh/list/zjlx"
        :on-remote-response="'data'"
      />
      <van-field label="转入方代表证件号码" v-model="circulation.zrfdbzjhm" placeholder="请输入证件号码" input-align="right" label-width="auto"/>
      <van-field v-model="circulation.zrfhkszd" label="户口所在地" placeholder="户口所在地" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
      <van-cell title="是否本集体经济组织成员">
        <template #right-icon>
          <van-radio-group  v-model="circulation.zrfsfbjtjjzzcy" direction="horizontal">
            <van-radio name="1">是</van-radio>
            <van-radio name="0">否</van-radio>
          </van-radio-group>
        </template>
      </van-cell>
    </div>
    <p class="main_title">流转信息</p>
    <div class="main_box">
      <van-field label="流转面积(㎡)" v-model="circulation.lzmj" placeholder="请输入流转面积(㎡)" input-align="right" :rules="[{ required: true }]" required  label-width="auto"/>
      <van-field label="建筑面积(㎡)" v-model="circulation.jzmj" placeholder="请输入建筑面积(㎡)" input-align="right" :rules="[{ required: true }]" required label-width="auto"/>
      <van-field label="流转单价(元)" v-model="circulation.lzdj" placeholder="请输入流转单价(元)" input-align="right" label-width="auto"/>
      <van-field label="流转费用(元)" v-model="circulation.lzfy" placeholder="请输入流转费用(元)" input-align="right" label-width="auto"/>
      <van-field label="集合收益金额(元)" v-model="circulation.jtsyje" placeholder="请输入集体收益金额(元)" input-align="right" label-width="auto"/>
      <van-field
        readonly
        clickable
        v-model="circulation.htqdrq"
        label="合同签订日期"
        placeholder="请选择合同签订日期"
        @click="showhtqdrq = true"
        input-align="right"
        :rules="[{ required: true }]"
        required
        right-icon="arrow-down"
      />
      <van-popup v-model="showhtqdrq" position="bottom">
        <van-datetime-picker
          v-model="currentDate"
          type="date"
          title="选择年月日"
          :min-date="minDate"
          :max-date="maxDate"
          @confirm="onConfirmHtqdrq"
        />
      </van-popup>
      <van-field
        readonly
        clickable
        v-if="qsrqOpen"
        v-model="circulation.lzqsrq"
        label="流转起始时间"
        placeholder="请选择起始时间"
        @click="showlzqsrq = true"
        input-align="right"
        right-icon="arrow-down"
      />
      <van-popup v-model="showlzqsrq" position="bottom">
        <van-datetime-picker
          v-model="currentDate"
          type="date"
          title="选择年月日"
          :min-date="minDate"
          :max-date="maxDate"
          @confirm="onConfirmLzqsrq"
        />
      </van-popup>

      <van-field
        readonly
        clickable
        v-model="circulation.lzjsrq"
        v-if="jsrqOpen"
        label="流转结束时间"
        placeholder="请选择结束时间"
        @click="showlzjsrq = true"
        input-align="right"
        right-icon="arrow-down"
      />
      <van-popup v-model="showlzjsrq" position="bottom">
        <van-datetime-picker
          v-model="currentDate"
          type="date"
          title="选择年月日"
          :min-date="minDate"
          :max-date="maxDate"
          @confirm="onConfirmLzjsrq"
        />
      </van-popup>

      <van-field
        readonly
        clickable
        v-model="lzqfwyt"
        label="流转前房屋用途"
        placeholder="请选择流转前房屋用途"
        @click="showLzqfwyt = true"
        input-align="right"
        right-icon="arrow-down"
        label-width="auto"
      />
      <van-popup v-model="showLzqfwyt" position="bottom">
        <van-picker
          show-toolbar
          :columns="lzqfwytDictionaries"
          @confirm="onConfirmLzqfwyt"
          @cancel="showLzqfwyt = false"
        />
      </van-popup>

      <van-field
        readonly
        clickable
        v-model="lzhfwyt"
        label="流转后房屋用途"
        placeholder="请选择流转后房屋用途"
        @click="showLzhfwyt = true"
        input-align="right"
        right-icon="arrow-down"
        label-width="auto"
      />
      <van-popup v-model="showLzhfwyt" position="bottom">
        <van-picker
          show-toolbar
          :columns="lzhfwytDictionaries"
          @confirm="onConfirmLzhfwyt"
          @cancel="showLzhfwyt = false"
        />
      </van-popup>
      <van-field v-if="zrnxOpen" label="转入年限" v-model="circulation.zrnx" placeholder="请输入转入年限" input-align="right" label-width="auto"/>
    </div>
    <p class="main_title">其他</p>
    <div class="main_box">
      <van-field label="所有权人代表姓名" v-model="circulation.suyqrdbxm" placeholder="请输入姓名" input-align="right" label-width="auto"/>
      <van-field label="村集体意见" v-model="circulation.suyqryj" placeholder="请输入内容" input-align="right" label-width="auto"/>
      <van-field label="备注" v-model="circulation.bz" placeholder="请输入备注" input-align="right" label-width="auto"/>
    </div>
    <van-dialog v-if="circulation.lzfs == '01' || circulation.lzfs == '02'" v-model="mapShow" show-cancel-button>
      <MapGisObtainTc ref="zjdProductResh" :shqrxm="circulation.zrfdbxm" :landStatus="landStatus" :deptId="sysFarmer.deptId"></MapGisObtainTc>
    </van-dialog>
    <van-dialog v-else v-model="mapShow" show-cancel-button>
      <MapGisObtainTc ref="zjdProductResh" :shqrxm="circulation.shyqrxm" :landStatus="landStatus" :deptId="sysFarmer.deptId"></MapGisObtainTc>
    </van-dialog>
    <van-dialog v-show="circulation.lzfs == '03'" v-model="hhMapShow" show-cancel-button>
      <MapGisObtainTc ref="zjdZrfProductResh" :shqrxm="circulation.zrfdbxm" :landStatus="landStatus" :deptId="sysFarmer.deptId"></MapGisObtainTc>
    </van-dialog>
    <div style="padding: 16px 0;">
      <van-row>
        <van-col span="24" align="center">
          <van-button type="info" native-type="submit" class="submitButton" @click="back">返<i style="margin-right: 1em;"></i>回</van-button>
        </van-col>
      </van-row>
      <div class="clear"></div>
    </div>
  </div>
</template>

<script>
  import { getLz , zjdzd , getByZjddm , edit , goApply,homeLzAdd } from "@/api/onlineHome/homestead/circulation";
  import {  getShyqrs,getByLyZjddm,listHomesteadnmfw} from "@/api/sunVillage_info/homestead/paidExit";
  import FieldSelect from "@/components/form/FieldSelect";
  import MapGisObtainTc from "@/components/Map/MapGisObtainTc";
  export default {
    name: "circulationAdd",
    components: { MapGisObtainTc,FieldSelect },
    data() {
      return {
        lzfsDictionaries: [],//流转方式
        shyqrdmDictionaries: [],//转出方使用权人代码
        lzqfwytDictionaries: [],//流转前房屋类型
        lzhfwytDictionaries: [],//流转后房屋类型
        zrfdbmcDictionaries: [],//转入方代表名称
        zrfdbzjlxDictionaries: [],//转入方证件类型
        zjdDictionaries: [],//宅基地列表
        getObligeeOptions:[],
        getZrfObligeeOptions:[],
        xbDictionaries:[],//申请人证件类型
        xb:'男',
        lzfs: '转让',//流转方式
        shyqrdm: '',//转出方使用权人代码
        lzqfwyt: '',//流转前房屋类型
        lzhfwyt: '',//流转后房屋类型
        zrfdbmc: '',//转入方代表名称
        zrfdbzjlx: '',//转入方证件类型
        sysFarmer:{deptId:this.$store.state.user.loginDeptId,memberName:""},
        landStatus:"1",
        zjd: [],//宅基地列表
        sfjtjjzzShow:false,
        zcfhkszdShow:false,
        xjdShow:false,
        qsrqOpen:false,
        shyqxmShow:false,
        houseOwnershipOpen:false,
        jsrqOpen:false,
        zrnxOpen:false,
        showhtqdrq:false,
        showDropList:false,
        showZrfList:false,
        showxb: false,
        showLzfs: false,
        showShyqrdm: false,
        showLzqfwyt: false,
        showLzhfwyt: false,
        showZrfdbmc: false,
        showZrfdbzjlx: false,
        showZjd:false,
        showlzqsrq:false,
        showlzjsrq:false,
        minDate: new Date(),
        maxDate: new Date(2025, 10, 1),
        currentDate: new Date(),
        circulation: {jzmj:0.00,zcfsfbjtjjzzcy:"Y",zrfsfbjtjjzzcy:"Y",lzfs:"01",houseOwnership:"2",phlyms:"10"},
        mapShow: false,
        hhMapShow:false,
      };
    },
    created() {
      this.getDetail();
    },
    methods: {
      onConfirmGsf(val){
        if(val === "1"){
          this.$set(this.circulation, "shyqrxm", this.$store.state.user.deptName+"村集体");
          this.landStatus  = "2";
          this.shyqxmShow = true;
          this.sfjtjjzzShow=true;
          this.zcfhkszdShow=true;
          this.xjdShow=true;
          this.zjddm = null;
        }else{
          this.shyqxmShow = false;
          this.sfjtjjzzShow=false;
          this.zcfhkszdShow=false;
          this.xjdShow=false;
        }
      },
      getDetail(){
        getLz(this.$route.query.id).then(response => {

          if(response.data.houseOwnership === "1"){
            this.shyqxmShow = true;
            this.sfjtjjzzShow=true;
            this.zcfhkszdShow=true;
            this.xjdShow=true;
            this.houseOwnershipOpen = true;
            this.qsrqOpen = true;
            this.jsrqOpen = true;
            this.zrnxOpen = true;
          }
          //流转方式
          this.houseGetDicts("lzfs").then((res) => {
            for( let i = 0 ; i < res.data.length ; i++){
              if(res.data[i].dictSort < 6){
                this.lzfsDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
              }
            }
            this.lzfs = this.selectDictLabel(res.data, response.data.lzfs);
          });
          //转入方证件类型
          this.houseGetDicts("zjlx").then((res) => {
            for( let i = 0 ; i < res.data.length ; i++){
              this.zrfdbzjlxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
            }
            this.zrfdbzjlx = this.selectDictLabel(res.data, response.data.zrfdbzjlx);
          });
          //流转前房屋用途
          this.houseGetDicts("fwyt").then((res) => {//流转前房屋用途
            console.log(res)
            for( let i = 0 ; i < res.data.length ; i++){
              this.lzqfwytDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
            }
            this.lzqfwyt = this.selectDictLabel(res.data, response.data.lzqfwyt);
          });
          //流转后房屋用途
          this.houseGetDicts("fwyt").then((res) => {//流转后房屋用途
            for( let i = 0 ; i < res.data.length ; i++){
              this.lzhfwytDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
            }
            this.lzhfwyt = this.selectDictLabel(res.data, response.data.lzhfwyt);
          });

          this.circulation = response.data;
          if(response.data.lzfs === "04" || response.data.lzfs === "05"){
            this.landStatus  = "4";
          }else {
            this.landStatus  = "1";
          }
        });
      },
      onConfirmLzfs(value) {
        if(value.value === "04" || value.value === "05"){
          this.houseOwnershipOpen = true;
          this.qsrqOpen = true;
          this.jsrqOpen = true;
          this.zrnxOpen = true;
        }else{
          this.houseOwnershipOpen = false;
          this.qsrqOpen = false;
          this.jsrqOpen = false;
          this.zrnxOpen = false;
          this.$set(this.circulation, "houseOwnership", "2");
        }
        this.lzfs = value.text;
        this.circulation.lzfs = value.value;
        this.showLzfs = false;
      }, //流转方式
      onConfirmZjd(value) {
        this.circulation.zjddm = value;
        var form = {};
        form.zjddm = value;
        getByZjddm(form).then(qlrRes => {
          console.log(qlrRes.data.shyqrdm)
          this.circulation.shyqrdm = qlrRes.data.shyqrdm;
          this.$forceUpdate();
        });
        this.showZjd = false;

      },
      mapLook(){
        this.mapShow = true;
        setTimeout(() => {
          this.$refs.zjdProductResh.drawingLyPaceCountryDarw();
        },1000);
      },
      hhMapLook(){
        this.hhMapShow = true;
        setTimeout(() => {
          this.$refs.zjdZrfProductResh.drawingLyPaceCountryDarw();
        },1000);
      },
      onConfirmXb(data){
        this.xb = data.text;
        this.circulation.xb = data.value;
        this.showxb = false;
      },
      /** 模糊查询人员信息 */
      remoteTransfereeMethod(query) {
        if (query !== "") {
          getShyqrs({shyqrdbxm:query,status:1,deptId:this.sysFarmer.deptId}).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,
                  zjddm:item.zjddm,
                  sfbncjtjjzzcy:item.sfbncjtjjzzcy,
                  shyqrdm:item.shyqrdm,
                }
              })
              //设置模糊查询的下拉框和滚动条
              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;
        }
      },

      /** 模糊查询人员信息 */
      remoteTransfereeMethodTwo(query) {
        if (query !== "") {
          getShyqrs({shyqrdbxm:query,status:1,deptId:this.sysFarmer.deptId}).then((response) => {
            if (response.code == 200) {
              this.getZrfObligeeOptions = 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,
                  zjddm:item.zjddm,
                  sfbncjtjjzzcy:item.sfbncjtjjzzcy,
                }
              })
              //设置模糊查询的下拉框和滚动条
              if (this.getZrfObligeeOptions.length > 0) {
                this.showZrfList = true;   // div显示会阻挡下边的选择框和输入框，showDropList控制下拉框是否显示
                //设置模糊查询的和滚动条
                this.$nextTick(() => {
                  if (this.getZrfObligeeOptions.length > 4) {
                    let height = document.getElementById("vanCellZrf").offsetHeight * 4;
                    document.getElementById("zrfList").style.height = height + "px";
                    document.getElementById("zrfList").style.overflow = "scroll";
                  } else {
                    document.getElementById("zrfList").style.height = "";
                    document.getElementById("zrfList").style.overflow = "visible";
                  }
                });
              } else {
                this.showZrfList = false;
              }
            }
          });
        } else {
          this.getZrfObligeeOptions = [];
          this.showZrfList = false;
        }
      },
      shyqrdmxmChange(val){
        this.$set(this.circulation, "shyqrxm", val.sqrxm);
        this.$set(this.circulation, "deptId", val.deptId);
        this.$set(this.circulation, "deptName", val.deptName);
        this.$set(this.circulation, "sqrzjhm", val.sqrzjhm);
        this.$set(this.circulation, "sqrzjlx", val.sqrzjlx);
        this.$set(this.circulation, "sqrnhdm", val.sqrnhdm);
        this.$set(this.circulation, "gyqk", val.gyfs);
        this.$set(this.circulation, "xb", val.sqrxb);
        this.$set(this.circulation, "lxdh", val.sqrdh);
        this.$set(this.circulation, "hkszd", val.dz);
        this.$set(this.circulation, "zjddm", val.zjddm);
        this.$set(this.circulation, "zcfsfbjtjjzzcy", val.sfbncjtjjzzcy);
        this.$set(this.circulation, "shyqrdm", val.shyqrdm);
        this.getObligeeOptions=[];
        this.showDropList = false;
      },

      zrfdmxmChange(val){
        this.$set(this.circulation, "zrfdbxm", val.sqrxm);
        this.$set(this.circulation, "zrfdbzjhm", val.sqrzjhm);
        this.$set(this.circulation, "zrfdbzjlx", val.sqrzjlx);
        this.$set(this.circulation, "zrfnhdm", val.sqrnhdm);
        this.$set(this.circulation, "zrfsfbjtjjzzcy", val.sfbncjtjjzzcy);
        this.$set(this.circulation, "hkszd", val.dz);
        this.getObligeeOptions=[];
        this.showZrfList = false;
      },

      /** 查找地图中宅基地 */
      closeMoule: function (data) {
        this.circulation.zjddm = data;
        let _this = this;
        getByLyZjddm(data).then((response) => {
          this.$set(this.circulation, "lzmj", response.data.zdmj);
          listHomesteadnmfw({zjddm: data}).then((res) => {
            res.rows.map(function(item){
              _this.$set(_this.circulation, "jzmj", Number(_this.circulation.jzmj) + 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);
          }
        });
      },
      //宅基地列表
      onConfirmShyqrdm(value) {
        this.showShyqrdm = false;
      }, //转出方使用权人代码
      onConfirmLzqfwyt(value) {
        this.lzqfwyt = value.text;
        this.circulation.lzqfwyt = value.value;
        this.showLzqfwyt = false;
      }, //流转前房屋用途
      onConfirmLzhfwyt(value) {
        this.lzhfwyt = value.text;
        this.circulation.lzhfwyt = value.value;
        this.showLzhfwyt = false;
      }, //流转后房屋用途
      onConfirmZrfdbmc(value) {
        this.value = value;
        this.showZrfdbmc = false;
      }, //转入方代表名称
      onConfirmZrfdbzjlx(value) {
        this.zrfdbzjlx = value.text;
        this.circulation.zrfdbzjlx = value.value;
        this.showZrfdbzjlx = false;
      }, //转入方代表证件类型
      onConfirmLzqsrq(value) {
        this.circulation.lzqsrq = this.getNowFormatDate(value).substr(0,10);
        this.showlzqsrq = false;
      }, //流转起始时间onConfirmHtqdrq
      onConfirmHtqdrq(value) {
        this.circulation.htqdrq = this.getNowFormatDate(value).substr(0,10);
        this.showhtqdrq = false;
      },
      onConfirmLzjsrq(value) {
        this.circulation.lzjsrq = this.getNowFormatDate(value).substr(0,10);
        this.showlzjsrq = false;
      }, //流转结束时间
      goAdd(){
        homeLzAdd(this.circulation).then(response => {
          if(response.code = 200){
            this.$toast.success('保存成功');
            this.back();

          }
        });
      },
      back() {
        setTimeout(() => this.$router.back(-1), 1000)
      },
    },
  }
</script>

<style scoped lang="scss">
  .app-container {
  .header_main{
    height: 116px;
    background: url('../../../../assets/images/sunVillage_info/list_head.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;
  .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;

  }
</style>
