nsgk_mobile/src/views/yinnong/homestead/freeExit/freeExitDetail.vue

<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>

      <div class="main_box">
        <!--        <van-field v-model="circulation.sqrxm" label="申请人姓名" placeholder="申请人姓名" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>-->
        <van-field  readonly 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
          readonly
          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>
        <field-select
          readonly
          v-model="circulation.xb"
          label="性別"
          value-key="dictLabel"
          data-key="dictValue"
          placeholder="选择现状"
          :rules="[{ required: true }]"
          required
          remote-url="/open/zdzh/list/sys_user_sex"
          :on-remote-response="'data'"
        />

        <van-field readonly v-model="circulation.sqrzjhm" label="申请人证件号码" placeholder="申请人证件号码" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
        <van-field readonly v-model="circulation.lxdh" label="联系电话" placeholder="联系电话" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
        <field-select
          readonly
          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 readonly v-model="circulation.hkszd" label="户口所在地" placeholder="户口所在地" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
      </div>
              <div v-if="circulation.jtcyqkList">
                <p class="main_title">家庭成员情况</p>

                <div >
                  <van-tabs v-if="circulation.jtcyqkList && circulation.jtcyqkList.length > 0" v-model="familyMembersActive" ref="memberTabs">
                    <van-tab :title="(index + 1) + '. ' + item.xm" v-for="(item , index) in circulation.jtcyqkList" :key="index" swipeable>
                      <div class="familyList">
                        <div class="main_box" style="margin-bottom: 20px">
<!--                          <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteFamily(index)" />-->
                          <van-field readonly required v-model="item.xm" label="姓名" placeholder="姓名" input-align="right" :rules="[{ required: true }]"/>
                          <van-field readonly required v-model="item.nl" label="年龄" placeholder="年龄" input-align="right" :rules="[{ required: true }]"/>
                          <field-select
                            v-model="item.yhzgx"
                            readonly
                            label="与户主关系"
                            value-key="dictLabel"
                            data-key="dictValue"
                            placeholder="选择与户主关系"
                            :rules="[{ required: true }]"
                            required
                            remote-url="/open/zdzh/list/family_status"
                            :on-remote-response="'data'"
                          />
                          <van-field readonly required v-model="item.sfzh" label="身份证号" placeholder="身份证号" input-align="right" :rules="[{pattern: /^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/}]" @input="updateMemberInfo(index)"/>
                          <van-field readonly required v-model="item.hkszd" label="户口所在地" placeholder="户口所在地" input-align="right" :rules="[{ required: true }]"/>
                        </div>
                      </div>
                    </van-tab>
                  </van-tabs>
                </div>
              </div>
      <div v-if="circulation.gyrqkList">
        <p class="main_title">共有人情况</p>

        <div >
          <van-tabs v-if="circulation.gyrqkList && circulation.gyrqkList.length > 0" v-model="familyMembersActive" ref="memberTabs">
            <van-tab :title="(index + 1) + '. ' + item.xm" v-for="(item , index) in circulation.gyrqkList" :key="index" swipeable>
              <div class="familyList">
                <div class="main_box" style="margin-bottom: 20px">
<!--                  <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteFamily(index)" />-->
                  <van-field readonly required v-model="item.xm" label="姓名" placeholder="姓名" input-align="right" :rules="[{ required: true }]"/>
                  <van-field readonly required v-model="item.nl" label="年龄" placeholder="年龄" input-align="right" :rules="[{ required: true }]"/>
                  <field-select
                    v-model="item.yhzgx"
                    label="与户主关系"
                    value-key="dictLabel"
                    data-key="dictValue"
                    placeholder="选择与户主关系"
                    :rules="[{ required: true }]"
                    required
                    readonly
                    remote-url="/open/zdzh/list/family_status"
                    :on-remote-response="'data'"
                  />
                  <van-field readonly required v-model="item.sfzh" label="身份证号" placeholder="身份证号" input-align="right" :rules="[{pattern: /^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/}]" @input="updateMemberInfo(index)"/>
                  <van-field readonly required v-model="item.hkszd" label="户口所在地" placeholder="户口所在地" input-align="right" :rules="[{ required: true }]"/>
                </div>
              </div>
            </van-tab>
          </van-tabs>
        </div>
      </div>
      <p class="main_title">拟申请退出宅基地-面积</p>
      <van-field readonly v-model="circulation.tcmj" label="面积(㎡)" placeholder="请输入面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>
      <field-select
        readonly
        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'"
      />
      <p class="main_title">拟申请退出宅基地-四至</p>
      <van-field readonly v-model="circulation.zjdszd" label="东至" placeholder="东至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
      <van-field readonly v-model="circulation.zjdszn" label="南至" placeholder="南至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
      <van-field  readonly v-model="circulation.zjdszx" label="西至" placeholder="西至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
      <van-field readonly v-model="circulation.zjdszb" label="北至" placeholder="北至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>
      <p class="main_title">拟申请退出宅基地情况-地类</p>
      <field-select
        readonly
        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 readonly v-model="circulation.tcmj" label="退出面积(㎡)" placeholder="请输入退出面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>
      <van-field readonly 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="请选择退出权利类型"
          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"
            @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="请选择退出方式"
          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"
            @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 readonly v-model="circulation.xjzmj" label="建筑面积(㎡)" placeholder="请输入建筑面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>
      <van-field readonly v-model="circulation.xqszsh" label="权属证书号" placeholder="请输入权属证书号" input-align="right" label-width="auto" />
      <van-field readonly v-model="circulation.xjzdd" label="居住地点" placeholder="请输入居住地点" input-align="right" label-width="auto" />
      <p class="main_title">补偿信息</p>
      <van-field readonly v-model="circulation.bcje" label="宅基地补偿" placeholder="宅基地补偿" input-align="right" label-width="auto"  type="number"/>
      <van-field readonly v-model="circulation.dmfzwbc" label="地面附着物补偿" placeholder="地面附着物补偿" input-align="right" label-width="auto"  type="number"/>
      <field-select
        readonly
        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
        readonly
        v-model="circulation.bcsj"
        label="补偿时间"
        placeholder="选择日期"
        formatter="yyyy-MM-dd"
      />
      <p class="main_title">其他</p>

      <van-field readonly v-model="circulation.sqly" label="申请理由" placeholder="请输入申请理由" input-align="right" label-width="auto"/>
      <field-date-picker
        readonly
        v-model="circulation.sqrq"
        label="申请日期"
        placeholder="选择日期"
        :rules="[{ required: true }]"
        formatter="yyyy-MM-dd"
        required
      />
      <van-field readonly v-model="circulation.jbrxm" label="经办人姓名" placeholder="请输入经办人姓名" input-align="right" label-width="auto"/>
      <field-date-picker
        readonly
        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="circulation.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="houseApplyUploadComp.createBy"
              :full="houseApplyUploadComp.full"
            >
            </home-apply-upload-comp>
          </van-tab>
        </van-tabs>
      </van-popup>
      <!-- 审批 -->

        <div class="main_box examine_box" v-if="showCjt">
          <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 required :readonly="approval.type !== 'todo' || !cjtspOperation" v-model="circulation.cjzzscyj" rows="2" autosize type="textarea" placeholder="审核意见"/>
              <van-cell title="负责人:"  :rules="[{ required: true }]">
                <van-image
                  v-if="circulation.cjzzscr !='' && circulation.cjzzscr !=null && circulation.cjzzscr.endsWith('png')"
                  width="100"
                  height="50"
                  :src="$store.getters.baseRoutingUrl+circulation.cjzzscr"
                ></van-image>
                <div  v-if="circulation.cjzzscr !='' && circulation.cjzzscr !=null && !circulation.cjzzscr.endsWith('png')">{{circulation.cjzzscr}}</div>
              </van-cell>
              <field-date-picker
                v-model="circulation.cjzzscsj"
                label="审批日期"
                placeholder="选择日期"
                :readonly="approval.type !== 'todo' || !cjtspOperation"
                :rules="[{ required: true }]"
                formatter="yyyy-MM-dd"
                required
              />
            </van-col>

          </van-row>
        </div>

        <div class="main_box examine_box" v-if="showZjsp">
          <van-row type="flex" justify="space-between" align="center">
            <van-col span="5">镇级人<br/>民镇府<br/>意见</van-col>
            <van-col span="19">
              <van-field required :readonly="approval.type !== 'todo'" v-model="circulation.xzzfshpzyj" rows="2" autosize type="textarea" placeholder="审核意见"/>
              <van-cell title="负责人:"  :rules="[{ required: true }]">
                <van-image
                  v-if="circulation.xzzfshpzrxm !='' && circulation.xzzfshpzrxm !=null && circulation.xzzfshpzrxm.endsWith('png')"
                  width="100"
                  height="50"
                  :src="$store.getters.baseRoutingUrl+circulation.xzzfshpzrxm"
                ></van-image>
                <div v-if="circulation.xzzfshpzrxm !='' && circulation.xzzfshpzrxm !=null && !circulation.xzzfshpzrxm.endsWith('png')">{{circulation.xzzfshpzrxm}}</div>
              </van-cell>
              <field-date-picker
                v-model="circulation.xzzfshpzsj"
                label="审批日期"
                placeholder="选择日期"
                :rules="[{ required: true }]"
                :readonly="approval.type !== 'todo'"
                formatter="yyyy-MM-dd"
                required
              />
            </van-col>

          </van-row>
        </div>
      <div class="clear"></div>
      <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="同意" v-if="approval.type == 'todo'"  @click="complete(true)" />
        <van-goods-action-button type="danger" text="驳回" v-if="approval.type == 'todo'"  @click="complete(false)"/>
      </van-goods-action>
    </div>
</template>

<script>
  import {  getZyyctc,getShyqrs,zyyctcEdit,zyyctcApply,getByLyZjddm,listHomesteadnmfw} from "@/api/sunVillage_info/homestead/paidExit";
  import HomeApplyUploadComp from "@/components/home/HomeApplyUploadCompTc";
  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 request from '@/utils/request';
  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: "paidExitDetail",
  components: { MapGisObtainTc,FieldSelect,FieldDatePicker,HomeApplyUploadComp },
  data() {
    return {
      tcqllxDictionaries:[],//退出权利类型
      tclxDictionaries:[],//退出类型
      tcfsDictionaries:[],//退出方式
      xbDictionaries:[],//申请人证件类型
      zjlxDictionaries:[],
      bcfsDictionaries:[],//补偿方式
      zjdDictionaries:[],//宅基地代码
      getObligeeOptions:[],//下拉框列表
      tcqllx:'',
      tclx:'',
      tcfs:'',
      xb:'',
      bcfs:'',
      zjddm:'',
      landStatus:"1",
      nickName:this.$route.query.nickName,
      electronicSignature:this.$route.query.electronicSignature,
      showtcqllx: false,
      showtclx: false,
      showtcfs: false,
      showxb: false,
      showbcfs: false,
      showzjddm: false,
      showZjsp: false,
      showCjt:false,
      cjtspOperation:false,
      showDropList: false,//是否显示下拉框
      mapShow: false,
      attachmentVisible:false,
      // 家庭成员tab
      familyMembersActive: 0,
      active: 0,
      // 表单意图
      proposerStatus: PROPOSER_VIEW,
      circulation:{},
      // 当前附件tab
      attachmentActive: 0,
      // 申请附件树
      houseApplyUploadComp: {
        businessType: PROPOSER_MODULE,
        proposerId: this.$route.query.id,
        homeApplyStatus: "11",
        processKey: PROPOSER_STAGE_BASE_APPLY_ACTIVITY,
        tableName: PROPOSER_STAGE_BASE_APPLY_TABLE,
        attachmentList: [],
        readonly: true,
        full: false,
      },
      approval: {
        taskId: null,
        instanceId: null,
        type: null,
        id: null,
        comment: '',
      },
    };
  },
  created() {
    this.approval.id = this.$route.query.id;
    this.approval.instanceId = this.$route.query.instanceId;
    this.approval.type = this.$route.query.type;
    this.approval.taskId = this.$route.query.taskId;
    this.getDetail();
  },
  methods: {
    // 获取日期, yyyy-MM-dd
    getDate(d) {
      return formatDate(d ? d : new Date(), 'yyyy-MM-dd');
    },
    getDetail(){
      getZyyctc(this.$route.query.id).then(response => {
        this.circulation = response.data;
        if(this.circulation.jtcyqkList != null){
          for(let i = 0; i < this.circulation.jtcyqkList.length; i++)
          {
            this.updateMemberInfo(i);
          }
        }
        if(this.circulation.gyrqkList != null){
          for(let i = 0; i < this.circulation.gyrqkList.length; i++)
          {
            this.updateMemberInfoGy(i);
          }
        }
        if(this.approval.type === "todo"){
          if(response.data.auditStatus === "1" || response.data.auditStatus === "2"){
            if(this.electronicSignature != null){
              this.$set(this.circulation, "cjzzscr", this.electronicSignature);
            }else{
              this.$set(this.circulation, "cjzzscr", this.nickName);
            }
            let handlerTime = this.getDate();
            this.$set(this.circulation, "cjzzscsj", handlerTime);
            this.cjtspOperation = true;
            this.showCjt = true;

          }else if(response.data.auditStatus === "3"){
            this.showZjsp = true;
            this.showCjt = true;
            if(this.electronicSignature != null){
              this.zzfdzqmShow = true;
              this.$set(this.circulation, "xzzfshpzrxm", this.electronicSignature);
            }else{
              this.$set(this.circulation, "xzzfshpzrxm", this.nickName);
            }
            let handlerTime = this.getDate();
            this.$set(this.circulation, "xzzfshpzsj", handlerTime);
          }
        }else{
          if(response.data.auditStatus === "4" ){
            this.showCjt = true;
            this.showZjsp = true;
          }else if(response.data.auditStatus === "0" || response.data.auditStatus === "1"){
            this.showCjt = false;
          }else{
            this.showCjt = true;
          }
        }

        //退出权利类型
        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.tcqllx = this.selectDictLabel(res.data, response.data.tcqllx);
        });
        //退出方式
        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.tcfs = this.selectDictLabel(res.data, response.data.tcfs);
        });
        //审核状态
        this.houseGetDicts("audit_status").then((res) => {
          this.circulation.auditStatus = this.selectDictLabel(res.data, response.data.auditStatus);
        });
      });
    },
    parseIDCard(idcard) {
      if(!idcard)
        return false;
      if(idcard.length !== 18)
        return false;
      if(!/^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/.test(idcard))
        return false;
      let sex = (parseInt(idcard.substr(16, 1)) % 2) ^ 1;
      let now = new Date().getFullYear();
      let y = parseInt(idcard.substr(6, 4));
      let age = Math.max(now - y, 0);
      return [sex, age];
    },
    updateMemberInfo(index) {
      let res = this.parseIDCard(this.circulation.jtcyqkList[index].sfzh);
      if(res)
      {
        this.$set(this.circulation.jtcyqkList[index], 'nl', res[1]);
      }
    },
    updateMemberInfoGy(index) {
      let res = this.parseIDCard(this.circulation.gyrqkList[index].sfzh);
      if(res)
      {
        this.$set(this.circulation.gyrqkList[index], 'nl', res[1]);
      }
    },
    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,
                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;
      }
    },
    shyqrdmxmChange(val){
      console.info(val);
      this.$set(this.circulation, "sqrxm", val.sqrxm);
      this.$set(this.circulation, "deptId", val.deptId);
      this.$set(this.circulation, "deptName", val.deptId);
      this.$set(this.circulation, "sqrzjhm", val.sqrzjhm);
      this.$set(this.circulation, "sqrzjlx", val.sqrzjlx);
      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.getObligeeOptions=[];
      this.showDropList = false;
    },
    /** 查找地图中宅基地 */
    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((response) => {
          response.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.rows[0].zdt != null && response.rows[0].zdt !== ""){
          this.$set(this.form, "xzzp", response.rows[0].zdt);
        }
      });
    },
    mapLook(){
      this.mapShow = true;
      setTimeout(() => {
        this.$refs.zjdProductResh.drawingLyPaceCountryDarw();
      },1000);
    },
    // 打开附件树
    openAttachment() {
      this.attachmentVisible = true;
      if(this.attachmentActive == this.active)
        this.$nextTick(() => {
          this.$refs.attachmentDialog.scrollTo(this.active);
        });
    },
    complete(pass) {
      if(this.circulation.auditStatus === "1" || this.circulation.auditStatus === "2"){
        this.approval.comment = this.circulation.cjzzscyj;
      }else{
        this.approval.comment = this.circulation.xzzfshpzyj;
      }
      if(!this.approval.taskId || !this.approval.instanceId || this.approval.type !== 'todo')
      {
        console.error("无效操作");
        return false;
      }
      if(!this.approval.comment)
      {
        this.notify("请填写审批意见", 'danger');
        return false;
      }
      /*let data = {
        taskId: this.approval.taskId,
        instanceId: this.approval.instanceId,
        variables: JSON.stringify({
          pass: pass ? "true" : "false",
          comment: this.approval.comment ? this.approval.comment : (pass ? '同意' : '驳回'),
        }),
      };
      request({
        url: "/activiti/process/complete",
        method: "post",
        params: data,
      }).then((response) => {
        this.notify("操作成功", 'success');
        this.$router.back();
      }).catch(e => {
        this.notify("操作失败!", 'danger');
      });*/
      if (pass) {
        let data = {
          taskId: this.approval.taskId,
          instanceId: this.approval.instanceId,
          variables: JSON.stringify({
            pass: "true",
            comment: this.approval.comment ? this.approval.comment : "同意",
          }),
        };
        zyyctcEdit(this.circulation).then(response => {
          request({
            url: "/activiti/process/complete",
            method: "post",
            params: data,
          }).then((response) => {
            this.notify("操作成功", 'success');
            this.$router.back();
          }).catch(e => {
            this.notify("操作失败!", 'danger');
          });
        });

      } else {
        let _this = this;
        _this.$dialog.confirm({
          message: '是否确认驳回此条申请',
        }).then(() => {
          let data = {
            taskId: _this.approval.taskId,
            instanceId: _this.approval.instanceId,
            variables: JSON.stringify({
              pass: "false",
              comment: _this.approval.comment ? _this.approval.comment : "驳回",
            }),
          };
          zyyctcEdit(this.circulation).then(response => {
            request({
              url: "/activiti/process/complete",
              method: "post",
              params: data,
            }).then((response) => {
              _this.notify("操作成功", 'success');
              _this.$router.back();
            }).catch(e => {
              _this.notify("操作失败!", 'danger');
            });
          });
        });
      }
      return true;
    },
    notify(message, type) {
      Notify.clear();
      Notify({ type: type || 'primary', message: message });
    },
  },
}
</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;

  }
  .clear{
    height: 80px;
  }
  .examine_box{
    background-color: #1D6FE9!important;
    padding: 0.18rem!important;
    padding-left: 0!important;
    border-radius: 0.15rem!important;
    margin-top: 0.3rem!important;
    .van-col:first-child{
      color: #FFF!important;
      font-size: 0.45rem!important;
      text-align: center!important;
    }
    .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;
      }
    }
  }
</style>