zhangzl
/
nsgk_mobile
2
0
派生 0
代码 工单 0 合并请求 0 版本发布 0 百科 动态
移动端
您最多选择25个主题 主题必须以字母或数字开头，可以包含连字符 (-)，并且长度不得超过35个字符
988 提交
7 分支
80 MiB
 
 
目录树: ae82309814
分支列表 标签列表
${ item.name }
创建分支 ${ searchTerm }
从 'ae82309814'
${ noResults }
nsgk_mobile/src/views/sunVillage_info/paidExit/paidExitDetail.vue

881 行
35 KiB
原始文件 Blame 文件历史 

  1. <template>

  2.     <div class="app-container">

  3. <!--      <van-nav-bar-->

  4. <!--        left-arrow-->

  5. <!--        fixed-->

  6. <!--        placeholder-->

  7. <!--        @click-left="$router.back(-1)"-->

  8. <!--      >-->

  9. <!--        <template #title>-->

  10. <!--          <p style="font-weight: bold;">有偿退出</p>-->

  11. <!--        </template>-->

  12. <!--      </van-nav-bar>-->

  13. 

  14.       <div class="header_main">

  15.         有偿退出

  16.         <div class="return_btn" @click="onClickLeft"></div>

  17.         <!--      <div class="add_btn" @click="goAdd"></div>-->

  18.       </div>

  19. 

  20.       <div class="main_box">

  21.         <!--        <van-field v-model="circulation.sqrxm" label="申请人姓名" placeholder="申请人姓名" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>-->

  22.         <van-field  readonly v-model="circulation.sqrxm" label="申请人姓名" placeholder="申请人姓名" input-align="right" label-width="auto" :rules="[{ required: true }]" required @input="remoteTransfereeMethod" />

  23.         <div id="dropList" v-show="showDropList"  style="width: 92vw; position: absolute; z-index: 99; left: 50%; margin-left: -46vw; border: 1px solid #E2E0E0;" >

  24.           <van-cell id="vanCell"  v-for="(item, index) in getObligeeOptions" :key="index" @click="shyqrdmxmChange(item)" style="position: relative; z-index: 999;">

  25.             {{item.sqrxm}}

  26.           </van-cell>

  27.         </div>

  28.         <!--        <van-field-->

  29.         <!--          readonly-->

  30.         <!--          clickable-->

  31.         <!--          v-model="circulation.zjddm"-->

  32.         <!--          label="宅基地代码"-->

  33.         <!--          placeholder="请选择"-->

  34.         <!--          @click="remoteProposerMethod"-->

  35.         <!--          input-align="right"-->

  36.         <!--          right-icon="arrow-down" :rules="[{ required: true }]" required-->

  37.         <!--        />-->

  38.         <!--        <van-popup v-model="showzjddm" position="bottom">-->

  39.         <!--          <van-picker-->

  40.         <!--            show-toolbar-->

  41.         <!--            :columns="zjdDictionaries"-->

  42.         <!--            value-key="zjddm"-->

  43.         <!--            @confirm="onConfirmZjddm"-->

  44.         <!--            @cancel="showzjddm = false"-->

  45.         <!--          />-->

  46.         <!--        </van-popup>-->

  47.         <van-field

  48.           readonly

  49.           v-model="circulation.zjddm"

  50.           label="宅基地代码"

  51.           input-align="right"

  52.         >

  53.           <template #button>

  54.             <van-icon name="../../../static/images/22.png"  color="#539FFD" size="20" @click="mapLook"/>

  55.           </template>

  56.         </van-field>

  57.         <field-select

  58.           readonly

  59.           v-model="circulation.xb"

  60.           label="性別"

  61.           value-key="dictLabel"

  62.           data-key="dictValue"

  63.           placeholder="选择现状"

  64.           :rules="[{ required: true }]"

  65.           required

  66.           remote-url="/system/dict/data/type/sys_user_sex"

  67.           :on-remote-response="'data'"

  68.         />

  69. 

  70.         <van-field readonly v-model="circulation.sqrzjhm" label="申请人证件号码" placeholder="申请人证件号码" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>

  71.         <van-field readonly v-model="circulation.lxdh" label="联系电话" placeholder="联系电话" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>

  72.         <field-select

  73.           readonly

  74.           v-model="circulation.gyqk"

  75.           label="共有情况"

  76.           value-key="dictLabel"

  77.           data-key="dictValue"

  78.           placeholder="选择共有情况"

  79.           :rules="[{ required: true }]"

  80.           required

  81.           remote-url="/system/dict/data/type/house_yes_no"

  82.           :on-remote-response="'data'"

  83.         />

  84.         <van-field readonly v-model="circulation.hkszd" label="户口所在地" placeholder="户口所在地" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>

  85.       </div>

  86.               <div v-if="circulation.jtcyqkList">

  87.                 <p class="main_title">家庭成员情况</p>

  88. 

  89.                 <div >

  90.                   <van-tabs v-if="circulation.jtcyqkList && circulation.jtcyqkList.length > 0" v-model="familyMembersActive" ref="memberTabs">

  91.                     <van-tab :title="(index + 1) + '. ' + item.xm" v-for="(item , index) in circulation.jtcyqkList" :key="index" swipeable>

  92.                       <div class="familyList">

  93.                         <div class="main_box" style="margin-bottom: 20px">

  94. <!--                          <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteFamily(index)" />-->

  95.                           <van-field readonly required v-model="item.xm" label="姓名" placeholder="姓名" input-align="right" :rules="[{ required: true }]"/>

  96.                           <van-field readonly required v-model="item.nl" label="年龄" placeholder="年龄" input-align="right" :rules="[{ required: true }]"/>

  97.                           <field-select

  98.                             v-model="item.yhzgx"

  99.                             readonly

  100.                             label="与户主关系"

  101.                             value-key="dictLabel"

  102.                             data-key="dictValue"

  103.                             placeholder="选择与户主关系"

  104.                             :rules="[{ required: true }]"

  105.                             required

  106.                             remote-url="/system/dict/data/type/family_status"

  107.                             :on-remote-response="'data'"

  108.                           />

  109.                           <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)"/>

  110.                           <van-field readonly required v-model="item.hkszd" label="户口所在地" placeholder="户口所在地" input-align="right" :rules="[{ required: true }]"/>

  111.                         </div>

  112.                       </div>

  113.                     </van-tab>

  114.                   </van-tabs>

  115.                 </div>

  116.               </div>

  117.       <div v-if="circulation.gyrqkList">

  118.         <p class="main_title">共有人情况</p>

  119. 

  120.         <div >

  121.           <van-tabs v-if="circulation.gyrqkList && circulation.gyrqkList.length > 0" v-model="familyMembersActive" ref="memberTabs">

  122.             <van-tab :title="(index + 1) + '. ' + item.xm" v-for="(item , index) in circulation.gyrqkList" :key="index" swipeable>

  123.               <div class="familyList">

  124.                 <div class="main_box" style="margin-bottom: 20px">

  125. <!--                  <van-button icon="minus" size="mini" type="danger" class="deleteFamily" native-type="button" v-if="index!=0" @click="deleteFamily(index)" />-->

  126.                   <van-field readonly required v-model="item.xm" label="姓名" placeholder="姓名" input-align="right" :rules="[{ required: true }]"/>

  127.                   <van-field readonly required v-model="item.nl" label="年龄" placeholder="年龄" input-align="right" :rules="[{ required: true }]"/>

  128.                   <field-select

  129.                     v-model="item.yhzgx"

  130.                     label="与户主关系"

  131.                     value-key="dictLabel"

  132.                     data-key="dictValue"

  133.                     placeholder="选择与户主关系"

  134.                     :rules="[{ required: true }]"

  135.                     required

  136.                     readonly

  137.                     remote-url="/system/dict/data/type/family_status"

  138.                     :on-remote-response="'data'"

  139.                   />

  140.                   <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)"/>

  141.                   <van-field readonly required v-model="item.hkszd" label="户口所在地" placeholder="户口所在地" input-align="right" :rules="[{ required: true }]"/>

  142.                 </div>

  143.               </div>

  144.             </van-tab>

  145.           </van-tabs>

  146.         </div>

  147.       </div>

  148.       <p class="main_title">拟申请退出宅基地-面积</p>

  149.       <van-field readonly v-model="circulation.tcmj" label="面积(㎡)" placeholder="请输入面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>

  150.       <field-select

  151.         readonly

  152.         v-model="circulation.xz"

  153.         label="现状"

  154.         value-key="dictLabel"

  155.         data-key="dictValue"

  156.         placeholder="选择现状"

  157.         :rules="[{ required: true }]"

  158.         required

  159.         remote-url="/system/dict/data/type/dsxz"

  160.         :on-remote-response="'data'"

  161.       />

  162.       <p class="main_title">拟申请退出宅基地-四至</p>

  163.       <van-field readonly v-model="circulation.zjdszd" label="东至" placeholder="东至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>

  164.       <van-field readonly v-model="circulation.zjdszn" label="南至" placeholder="南至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>

  165.       <van-field  readonly v-model="circulation.zjdszx" label="西至" placeholder="西至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>

  166.       <van-field readonly v-model="circulation.zjdszb" label="北至" placeholder="北至" input-align="right" label-width="auto" :rules="[{ required: true }]" required/>

  167.       <p class="main_title">拟申请退出宅基地情况-地类</p>

  168.       <field-select

  169.         readonly

  170.         v-model="circulation.dldm"

  171.         label="地类"

  172.         value-key="dictLabel"

  173.         data-key="dictValue"

  174.         placeholder="选择现状"

  175.         :rules="[{ required: true }]"

  176.         required

  177.         remote-url="/system/dict/data/type/geographic_type"

  178.         :on-remote-response="'data'"

  179.       />

  180.       <p class="main_title">退出宅基地情况</p>

  181.       <van-field readonly v-model="circulation.tcmj" label="退出面积(㎡)" placeholder="请输入退出面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>

  182.       <van-field readonly v-model="circulation.jzmj" label="建筑面积(㎡)" placeholder="请输入建筑面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>

  183.       <div class="main_box">

  184.         <van-field

  185.           readonly

  186.           clickable

  187.           v-model="tcqllx"

  188.           label="退出权利类型"

  189.           placeholder="请选择退出权利类型"

  190.           input-align="right"

  191.           right-icon="arrow-down"

  192.           label-width="auto" :rules="[{ required: true }]" required

  193.         />

  194.         <van-popup v-model="showtcqllx" position="bottom">

  195.           <van-picker

  196.             show-toolbar

  197.             :columns="tcqllxDictionaries"

  198.             @cancel="showtcqllx = false"

  199.           />

  200.         </van-popup>

  201. 

  202.         <!--<van-field

  203.           readonly

  204.           clickable

  205.           v-model="tclx"

  206.           label="退出类型"

  207.           placeholder="请选择退出类型"

  208.           @click="showtclx = true"

  209.           input-align="right"

  210.           right-icon="arrow-down"

  211.           label-width="auto" :rules="[{ required: true }]" required

  212.         />

  213.         <van-popup v-model="showtclx" position="bottom">

  214.           <van-picker

  215.             show-toolbar

  216.             :columns="tclxDictionaries"

  217.             @confirm="onConfirmTclx"

  218.             @cancel="showtclx = false"

  219.           />

  220.         </van-popup>-->

  221. 

  222.         <van-field

  223.           readonly

  224.           clickable

  225.           v-model="tcfs"

  226.           label="退出方式"

  227.           placeholder="请选择退出方式"

  228.           input-align="right"

  229.           right-icon="arrow-down"

  230.           label-width="auto" :rules="[{ required: true }]" required

  231.         />

  232.         <van-popup v-model="showtcfs" position="bottom">

  233.           <van-picker

  234.             show-toolbar

  235.             :columns="tcfsDictionaries"

  236.             @cancel="showtcfs = false"

  237.           />

  238.         </van-popup>

  239. 

  240.         <van-field v-model="circulation.tcqszsh" label="权属证书号" placeholder="请输入权属证书号" input-align="right" label-width="auto" />

  241.       </div>

  242.       <p class="main_title">现居住情况</p>

  243.       <van-field readonly v-model="circulation.xjzmj" label="建筑面积(㎡)" placeholder="请输入建筑面积㎡" input-align="right" label-width="auto" :rules="[{ required: true }]" required type="number"/>

  244.       <van-field readonly v-model="circulation.xqszsh" label="权属证书号" placeholder="请输入权属证书号" input-align="right" label-width="auto" />

  245.       <van-field readonly v-model="circulation.xjzdd" label="居住地点" placeholder="请输入居住地点" input-align="right" label-width="auto" />

  246.       <p class="main_title">补偿信息</p>

  247.       <van-field readonly v-model="circulation.bcje" label="宅基地补偿" placeholder="宅基地补偿" input-align="right" label-width="auto"  type="number"/>

  248.       <van-field readonly v-model="circulation.dmfzwbc" label="地面附着物补偿" placeholder="地面附着物补偿" input-align="right" label-width="auto"  type="number"/>

  249.       <field-select

  250.         readonly

  251.         v-model="circulation.yctcfs"

  252.         label="退出类型"

  253.         value-key="dictLabel"

  254.         data-key="dictValue"

  255.         placeholder="选择退出类型"

  256.         remote-url="/system/dict/data/type/yctcfs"

  257.         :on-remote-response="'data'"

  258.       />

  259.       <field-select

  260.         readonly

  261.         v-model="circulation.bcfs"

  262.         label="补偿方式"

  263.         value-key="dictLabel"

  264.         data-key="dictValue"

  265.         placeholder="选择退出类型"

  266.         remote-url="/system/dict/data/type/bcfs"

  267.         :on-remote-response="'data'"

  268.       />

  269.       <field-date-picker

  270.         readonly

  271.         v-model="circulation.bcsj"

  272.         label="补偿时间"

  273.         placeholder="选择日期"

  274.         formatter="yyyy-MM-dd"

  275.       />

  276.       <p class="main_title">其他</p>

  277. 

  278.       <van-field readonly v-model="circulation.sqly" label="申请理由" placeholder="请输入申请理由" input-align="right" label-width="auto"/>

  279.       <field-date-picker

  280.         readonly

  281.         v-model="circulation.sqrq"

  282.         label="申请日期"

  283.         placeholder="选择日期"

  284.         :rules="[{ required: true }]"

  285.         formatter="yyyy-MM-dd"

  286.         required

  287.       />

  288.       <van-field readonly v-model="circulation.jbrxm" label="经办人姓名" placeholder="请输入经办人姓名" input-align="right" label-width="auto"/>

  289.       <field-date-picker

  290.         readonly

  291.         v-model="circulation.pzrq"

  292.         label="批准日期"

  293.         placeholder="选择日期"

  294.         :rules="[{ required: true }]"

  295.         formatter="yyyy-MM-dd"

  296.         required

  297.       />

  298.       <field-date-picker

  299.         v-model="circulation.barq"

  300.         label="备案日期"

  301.         placeholder="选择日期"

  302.         :rules="[{ required: true }]"

  303.         formatter="yyyy-MM-dd"

  304.         required

  305.       />

  306. 

  307.       <van-dialog v-model="mapShow" show-cancel-button>

  308.         <MapGisObtainTc ref="zjdProductResh" :shqrxm="circulation.sqrxm" :landStatus="landStatus" :deptId="circulation.deptId" @closeMoule="closeMoule"></MapGisObtainTc>

  309.       </van-dialog>

  310.       <!-- 3组附件 -->

  311.       <van-popup

  312.         v-model="attachmentVisible"

  313.         closeable

  314.         position="top"

  315.         :style="{ height: '61.8%' }"

  316.         :close-on-click-overlay="proposerStatus == 1"

  317.         :lazy-render="false"

  318.       >

  319.         <van-tabs type="card" style="padding-top: 1.35rem;" color="#1D6FE9" :lazy-render="false" v-model="attachmentActive" ref="attachmentDialog">

  320.           <van-tab title="退出附件" key="0">

  321.             <home-apply-upload-comp

  322.               :business-type="houseApplyUploadComp.businessType"

  323.               :house-apply-status="houseApplyUploadComp.homeApplyStatus"

  324.               :process-key="houseApplyUploadComp.processKey"

  325.               :proposer-id="houseApplyUploadComp.proposerId"

  326.               :table-name="houseApplyUploadComp.tableName"

  327.               :readonly="houseApplyUploadComp.readonly"

  328.               :userName="houseApplyUploadComp.createBy"

  329.               :full="houseApplyUploadComp.full"

  330.             >

  331.             </home-apply-upload-comp>

  332.           </van-tab>

  333.         </van-tabs>

  334.       </van-popup>

  335.       <!-- 审批 -->

  336. 

  337.         <div class="main_box examine_box" v-if="showCjt">

  338.           <van-row type="flex" justify="space-between" align="center">

  339.             <van-col span="5">村集体<br/>经济组<br/>织或村<br/>民委员<br/>会意见</van-col>

  340.             <van-col span="19">

  341.               <van-field required :readonly="approval.type !== 'todo' || !cjtspOperation" v-model="circulation.cjzzscyj" rows="2" autosize type="textarea" placeholder="审核意见"/>

  342.               <van-cell title="负责人:"  :rules="[{ required: true }]">

  343.                 <van-image

  344.                   v-if="circulation.cjzzscr !='' && circulation.cjzzscr !=null && circulation.cjzzscr.endsWith('png')"

  345.                   width="100"

  346.                   height="50"

  347.                   :src="$store.getters.baseRoutingUrl+circulation.cjzzscr"

  348.                 ></van-image>

  349.                 <div  v-if="circulation.cjzzscr !='' && circulation.cjzzscr !=null && !circulation.cjzzscr.endsWith('png')">{{circulation.cjzzscr}}</div>

  350.               </van-cell>

  351.               <field-date-picker

  352.                 v-model="circulation.cjzzscsj"

  353.                 label="审批日期"

  354.                 placeholder="选择日期"

  355.                 :readonly="approval.type !== 'todo' || !cjtspOperation"

  356.                 :rules="[{ required: true }]"

  357.                 formatter="yyyy-MM-dd"

  358.                 required

  359.               />

  360.             </van-col>

  361. 

  362.           </van-row>

  363.         </div>

  364. 

  365.         <div class="main_box examine_box" v-if="showZjsp">

  366.           <van-row type="flex" justify="space-between" align="center">

  367.             <van-col span="5">镇级人<br/>民镇府<br/>意见</van-col>

  368.             <van-col span="19">

  369.               <van-field required :readonly="approval.type !== 'todo'" v-model="circulation.xzzfshpzyj" rows="2" autosize type="textarea" placeholder="审核意见"/>

  370.               <van-cell title="负责人:"  :rules="[{ required: true }]">

  371.                 <van-image

  372.                   v-if="circulation.xzzfshpzrxm !='' && circulation.xzzfshpzrxm !=null && circulation.xzzfshpzrxm.endsWith('png')"

  373.                   width="100"

  374.                   height="50"

  375.                   :src="$store.getters.baseRoutingUrl+circulation.xzzfshpzrxm"

  376.                 ></van-image>

  377.                 <div v-if="circulation.xzzfshpzrxm !='' && circulation.xzzfshpzrxm !=null && !circulation.xzzfshpzrxm.endsWith('png')">{{circulation.xzzfshpzrxm}}</div>

  378.               </van-cell>

  379.               <field-date-picker

  380.                 v-model="circulation.xzzfshpzsj"

  381.                 label="审批日期"

  382.                 placeholder="选择日期"

  383.                 :rules="[{ required: true }]"

  384.                 :readonly="approval.type !== 'todo'"

  385.                 formatter="yyyy-MM-dd"

  386.                 required

  387.               />

  388.             </van-col>

  389. 

  390.           </van-row>

  391.         </div>

  392.       <div class="clear"></div>

  393.       <van-goods-action style="z-index: 999;">

  394.         <van-goods-action-icon icon="label-o" text="附件" @click="openAttachment" color="#1D6FE9" />

  395.         <van-goods-action-button type="info" text="同意" v-if="approval.type == 'todo'"  @click="complete(true)" />

  396.         <van-goods-action-button type="danger" text="驳回" v-if="approval.type == 'todo'"  @click="complete(false)"/>

  397.       </van-goods-action>

  398.     </div>

  399. </template>

  400. 

  401. <script>

  402.   import {  getZyyctc,getShyqrs,zyyctcEdit,zyyctcApply,getByLyZjddm,listHomesteadnmfw} from "@/api/sunVillage_info/homestead/paidExit";

  403.   import HomeApplyUploadComp from "@/components/home/HomeApplyUploadComp";

  404.   import FieldSelect from "@/components/form/FieldSelect";

  405.   import FieldDatePicker from "@/components/form/FieldDatePicker";

  406.   import {formatDate} from "element-ui/src/utils/date-util.js";

  407.   import { } from "@/api/onlineHome/homestead/paidExit";

  408.   import {Notify} from "vant";

  409.   import MapGisObtainTc from "@/components/Map/MapGisObtainTc";

  410. import request from '@/utils/request';

  411.   const PROPOSER_VIEW = 1;

  412.   // 工作流名称

  413.   const PROPOSER_STAGE_BASE_APPLY_ACTIVITY = 'home_usetc';

  414.   // 附件表名

  415.   const PROPOSER_STAGE_BASE_APPLY_TABLE = 't_homeuse_zyyctc';

  416.   // 其他

  417.   const PROPOSER_MODULE = 'home';

  418. export default {

  419.   name: "paidExitDetail",

  420.   components: { MapGisObtainTc,FieldSelect,FieldDatePicker,HomeApplyUploadComp },

  421.   data() {

  422.     return {

  423.       tcqllxDictionaries:[],//退出权利类型

  424.       tclxDictionaries:[],//退出类型

  425.       tcfsDictionaries:[],//退出方式

  426.       xbDictionaries:[],//申请人证件类型

  427.       zjlxDictionaries:[],

  428.       bcfsDictionaries:[],//补偿方式

  429.       zjdDictionaries:[],//宅基地代码

  430.       getObligeeOptions:[],//下拉框列表

  431.       tcqllx:'',

  432.       tclx:'',

  433.       tcfs:'',

  434.       xb:'',

  435.       bcfs:'',

  436.       zjddm:'',

  437.       landStatus:"1",

  438.       nickName:this.$route.query.nickName,

  439.       electronicSignature:this.$route.query.electronicSignature,

  440.       showtcqllx: false,

  441.       showtclx: false,

  442.       showtcfs: false,

  443.       showxb: false,

  444.       showbcfs: false,

  445.       showzjddm: false,

  446.       showZjsp: false,

  447.       showCjt:false,

  448.       cjtspOperation:false,

  449.       showDropList: false,//是否显示下拉框

  450.       mapShow: false,

  451.       attachmentVisible:false,

  452.       // 家庭成员tab

  453.       familyMembersActive: 0,

  454.       active: 0,

  455.       // 表单意图

  456.       proposerStatus: PROPOSER_VIEW,

  457.       circulation:{},

  458.       // 当前附件tab

  459.       attachmentActive: 0,

  460.       // 申请附件树

  461.       houseApplyUploadComp: {

  462.         businessType: PROPOSER_MODULE,

  463.         proposerId: this.$route.query.id,

  464.         homeApplyStatus: "11",

  465.         processKey: PROPOSER_STAGE_BASE_APPLY_ACTIVITY,

  466.         tableName: PROPOSER_STAGE_BASE_APPLY_TABLE,

  467.         attachmentList: [],

  468.         readonly: true,

  469.         full: false,

  470.       },

  471.       approval: {

  472.         taskId: null,

  473.         instanceId: null,

  474.         type: null,

  475.         id: null,

  476.         comment: '',

  477.       },

  478.     };

  479.   },

  480.   created() {

  481.     this.approval.id = this.$route.query.id;

  482.     this.approval.instanceId = this.$route.query.instanceId;

  483.     this.approval.type = this.$route.query.type;

  484.     this.approval.taskId = this.$route.query.taskId;

  485.     this.getDetail();

  486.   },

  487.   methods: {

  488.     // 获取日期, yyyy-MM-dd

  489.     getDate(d) {

  490.       return formatDate(d ? d : new Date(), 'yyyy-MM-dd');

  491.     },

  492.     getDetail(){

  493.       getZyyctc(this.$route.query.id).then(response => {

  494.         this.circulation = response.data;

  495.         if(this.circulation.jtcyqkList != null){

  496.           for(let i = 0; i < this.circulation.jtcyqkList.length; i++)

  497.           {

  498.             this.updateMemberInfo(i);

  499.           }

  500.         }

  501.         if(this.circulation.gyrqkList != null){

  502.           for(let i = 0; i < this.circulation.gyrqkList.length; i++)

  503.           {

  504.             this.updateMemberInfoGy(i);

  505.           }

  506.         }

  507.         if(this.approval.type === "todo"){

  508.           if(response.data.auditStatus === "1" || response.data.auditStatus === "2"){

  509.             if(this.electronicSignature != null){

  510.               this.$set(this.circulation, "cjzzscr", this.electronicSignature);

  511.             }else{

  512.               this.$set(this.circulation, "cjzzscr", this.nickName);

  513.             }

  514.             let handlerTime = this.getDate();

  515.             this.$set(this.circulation, "cjzzscsj", handlerTime);

  516.             this.cjtspOperation = true;

  517.             this.showCjt = true;

  518. 

  519.           }else if(response.data.auditStatus === "3"){

  520.             this.showZjsp = true;

  521.             this.showCjt = true;

  522.             if(this.electronicSignature != null){

  523.               this.zzfdzqmShow = true;

  524.               this.$set(this.circulation, "xzzfshpzrxm", this.electronicSignature);

  525.             }else{

  526.               this.$set(this.circulation, "xzzfshpzrxm", this.nickName);

  527.             }

  528.             let handlerTime = this.getDate();

  529.             this.$set(this.circulation, "xzzfshpzsj", handlerTime);

  530.           }

  531.         }else{

  532.           if(response.data.auditStatus === "4" ){

  533.             this.showCjt = true;

  534.             this.showZjsp = true;

  535.           }else if(response.data.auditStatus === "0" || response.data.auditStatus === "1"){

  536.             this.showCjt = false;

  537.           }else{

  538.             this.showCjt = true;

  539.           }

  540.         }

  541. 

  542.         //退出权利类型

  543.         this.houseGetDicts("tcqllx").then((res) => {

  544.           for (var i = 0; i < res.data.length; i++) {

  545.             this.tcqllxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});

  546.           }

  547.           this.tcqllx = this.selectDictLabel(res.data, response.data.tcqllx);

  548.         });

  549.         //退出方式

  550.         this.houseGetDicts("tcfs").then((res) => {

  551.           for (var i = 0; i < res.data.length; i++) {

  552.             this.tcfsDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});

  553.           }

  554.           this.tcfs = this.selectDictLabel(res.data, response.data.tcfs);

  555.         });

  556.         //审核状态

  557.         this.houseGetDicts("audit_status").then((res) => {

  558.           this.circulation.auditStatus = this.selectDictLabel(res.data, response.data.auditStatus);

  559.         });

  560.       });

  561.     },

  562.     parseIDCard(idcard) {

  563.       if(!idcard)

  564.         return false;

  565.       if(idcard.length !== 18)

  566.         return false;

  567.       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))

  568.         return false;

  569.       let sex = (parseInt(idcard.substr(16, 1)) % 2) ^ 1;

  570.       let now = new Date().getFullYear();

  571.       let y = parseInt(idcard.substr(6, 4));

  572.       let age = Math.max(now - y, 0);

  573.       return [sex, age];

  574.     },

  575.     updateMemberInfo(index) {

  576.       let res = this.parseIDCard(this.circulation.jtcyqkList[index].sfzh);

  577.       if(res)

  578.       {

  579.         this.$set(this.circulation.jtcyqkList[index], 'nl', res[1]);

  580.       }

  581.     },

  582.     updateMemberInfoGy(index) {

  583.       let res = this.parseIDCard(this.circulation.gyrqkList[index].sfzh);

  584.       if(res)

  585.       {

  586.         this.$set(this.circulation.gyrqkList[index], 'nl', res[1]);

  587.       }

  588.     },

  589.     remoteProposerMethod() {

  590.       this.showzjddm = true;

  591.       this.zjdDictionaries = [];

  592.       if (this.circulation.sqrxm) {

  593.         getShyqrs({shyqrdbxm:this.circulation.sqrxm}).then(response => {

  594.           this.zjdDictionaries = response.data.map(item => {

  595.             return {

  596.               zjddm: item.zjddm,

  597.               shyqrdbxm: item.shyqrdbxm,

  598.               shyqrdbzjlx: item.shyqrdbzjlx,

  599.               shyqrdbzjhm: item.shyqrdbzjhm

  600.             }

  601.           });

  602.         });

  603.       } else {

  604.         this.zjdDictionaries = [];

  605.       }

  606.     },

  607.     /** 模糊查询人员信息 */

  608.     remoteTransfereeMethod(query) {

  609.       if (query !== "") {

  610.         getShyqrs({shyqrdbxm:query,status:1}).then((response) => {

  611.           if (response.code == 200) {

  612.             this.getObligeeOptions = response.rows.map(function (item) {

  613.               return {

  614.                 sqrxm:item.shyqrdbxm,

  615.                 sqrxb:item.xb,

  616.                 sqrzjhm:item.shyqrdbzjhm,

  617.                 sqrzjlx:item.shyqrdbzjlx,

  618.                 sqrdh:item.dh,

  619.                 gyfs:item.gyfs,

  620.                 dz:item.dz,

  621.                 deptId:item.deptId,

  622.                 deptName:item.deptName,

  623.               }

  624.             })

  625.             //设置模糊查询的下拉框和滚动条

  626.             if (this.getObligeeOptions.length > 0) {

  627.               this.showDropList = true;   // div显示会阻挡下边的选择框和输入框，showDropList控制下拉框是否显示

  628.               //设置模糊查询的和滚动条

  629.               this.$nextTick(() => {

  630.                 if (this.getObligeeOptions.length > 4) {

  631.                   let height = document.getElementById("vanCell").offsetHeight * 4;

  632.                   document.getElementById("dropList").style.height = height + "px";

  633.                   document.getElementById("dropList").style.overflow = "scroll";

  634.                 } else {

  635.                   document.getElementById("dropList").style.height = "";

  636.                   document.getElementById("dropList").style.overflow = "visible";

  637.                 }

  638.               });

  639.             } else {

  640.               this.showDropList = false;

  641.             }

  642.           }

  643.         });

  644.       } else {

  645.         this.getObligeeOptions = [];

  646.         this.showDropList = false;

  647.       }

  648.     },

  649.     shyqrdmxmChange(val){

  650.       console.info(val);

  651.       this.$set(this.circulation, "sqrxm", val.sqrxm);

  652.       this.$set(this.circulation, "deptId", val.deptId);

  653.       this.$set(this.circulation, "deptName", val.deptId);

  654.       this.$set(this.circulation, "sqrzjhm", val.sqrzjhm);

  655.       this.$set(this.circulation, "sqrzjlx", val.sqrzjlx);

  656.       this.$set(this.circulation, "gyqk", val.gyfs);

  657.       this.$set(this.circulation, "xb", val.sqrxb);

  658.       this.$set(this.circulation, "lxdh", val.sqrdh);

  659.       this.$set(this.circulation, "hkszd", val.dz);

  660.       this.getObligeeOptions=[];

  661.       this.showDropList = false;

  662.     },

  663.     /** 查找地图中宅基地 */

  664.     closeMoule: function (data) {

  665.       this.circulation.zjddm = data;

  666.       let _this = this;

  667.       let handlerTime = this.getDate();

  668.       this.$set(this.circulation, "sqrq", handlerTime);

  669.       this.$set(this.circulation, "pzrq", handlerTime);

  670.       this.$set(this.circulation, "barq", handlerTime);

  671.       getByLyZjddm(data).then((response) => {

  672.         this.$set(this.circulation, "ntcmj", response.data.zdmj);

  673.         this.$set(this.circulation, "tcmj", response.data.zdmj);

  674.         this.$set(this.circulation, "zjdszd", response.data.zdszd);

  675.         this.$set(this.circulation, "zjdszn", response.data.zdszn);

  676.         this.$set(this.circulation, "zjdszx", response.data.zdszx);

  677.         this.$set(this.circulation, "zjdszb", response.data.zdszb);

  678.         this.$set(this.circulation, "theGeomJson", response.data.theGeomJson);

  679.         this.$set(this.circulation, "tcqszsh", response.data.zsh);

  680.         listHomesteadnmfw({zjddm: data}).then((response) => {

  681.           response.rows.map(function(item){

  682.             _this.$set(_this.circulation, "jzmj", Number(_this.circulation.jzmj) + Number(item.jzmj));

  683.             _this.$set(_this.circulation, "xjzmj", Number(_this.circulation.xjzmj) + Number(item.jzmj));

  684.           });

  685.         });

  686.         // const baseImgUrl = this.$store.getters.baseRoutingUrl;

  687.         if(response.rows[0].zdt != null && response.rows[0].zdt !== ""){

  688.           this.$set(this.form, "xzzp", response.rows[0].zdt);

  689.         }

  690.       });

  691.     },

  692.     mapLook(){

  693.       this.mapShow = true;

  694.       setTimeout(() => {

  695.         this.$refs.zjdProductResh.drawingLyPaceCountryDarw();

  696.       },1000);

  697.     },

  698.     // 打开附件树

  699.     openAttachment() {

  700.       this.attachmentVisible = true;

  701.       if(this.attachmentActive == this.active)

  702.         this.$nextTick(() => {

  703.           this.$refs.attachmentDialog.scrollTo(this.active);

  704.         });

  705.     },

  706.     complete(pass) {

  707.       if(this.circulation.auditStatus === "1" || this.circulation.auditStatus === "2"){

  708.         this.approval.comment = this.circulation.cjzzscyj;

  709.       }else{

  710.         this.approval.comment = this.circulation.xzzfshpzyj;

  711.       }

  712.       if(!this.approval.taskId || !this.approval.instanceId || this.approval.type !== 'todo')

  713.       {

  714.         console.error("无效操作");

  715.         return false;

  716.       }

  717.       if(!this.approval.comment)

  718.       {

  719.         this.notify("请填写审批意见", 'danger');

  720.         return false;

  721.       }

  722.       /*let data = {

  723.         taskId: this.approval.taskId,

  724.         instanceId: this.approval.instanceId,

  725.         variables: JSON.stringify({

  726.           pass: pass ? "true" : "false",

  727.           comment: this.approval.comment ? this.approval.comment : (pass ? '同意' : '驳回'),

  728.         }),

  729.       };

  730.       request({

  731.         url: "/activiti/process/complete",

  732.         method: "post",

  733.         params: data,

  734.       }).then((response) => {

  735.         this.notify("操作成功", 'success');

  736.         this.$router.back();

  737.       }).catch(e => {

  738.         this.notify("操作失败!", 'danger');

  739.       });*/

  740.       if (pass) {

  741.         let data = {

  742.           taskId: this.approval.taskId,

  743.           instanceId: this.approval.instanceId,

  744.           variables: JSON.stringify({

  745.             pass: "true",

  746.             comment: this.approval.comment ? this.approval.comment : "同意",

  747.           }),

  748.         };

  749.         zyyctcEdit(this.circulation).then(response => {

  750.           request({

  751.             url: "/activiti/process/complete",

  752.             method: "post",

  753.             params: data,

  754.           }).then((response) => {

  755.             this.notify("操作成功", 'success');

  756.             this.$router.back();

  757.           }).catch(e => {

  758.             this.notify("操作失败!", 'danger');

  759.           });

  760.         });

  761. 

  762.       } else {

  763.         let _this = this;

  764.         _this.$dialog.confirm({

  765.           message: '是否确认驳回此条申请',

  766.         }).then(() => {

  767.           let data = {

  768.             taskId: _this.approval.taskId,

  769.             instanceId: _this.approval.instanceId,

  770.             variables: JSON.stringify({

  771.               pass: "false",

  772.               comment: _this.approval.comment ? _this.approval.comment : "驳回",

  773.             }),

  774.           };

  775.           zyyctcEdit(this.circulation).then(response => {

  776.             request({

  777.               url: "/activiti/process/complete",

  778.               method: "post",

  779.               params: data,

  780.             }).then((response) => {

  781.               _this.notify("操作成功", 'success');

  782.               _this.$router.back();

  783.             }).catch(e => {

  784.               _this.notify("操作失败!", 'danger');

  785.             });

  786.           });

  787.         });

  788.       }

  789.       return true;

  790.     },

  791.     notify(message, type) {

  792.       Notify.clear();

  793.       Notify({ type: type || 'primary', message: message });

  794.     },

  795.   },

  796. }

  797. </script>

  798. 

  799. <style scoped lang="scss">

  800.   .app-container {

  801.     padding-bottom: 2%;

  802.     .header_main{

  803.       height: 116px;

  804.       background: url('../../../assets/images/sunVillage_info/list_head_green.png') no-repeat;

  805.       background-size: 100% 100%;

  806.       position: fixed;

  807.       top: 0;

  808.       left: 0;

  809.       width: 100%;

  810.       font-size: 36px;

  811.       line-height: 116px;

  812.       text-align: center;

  813.       color: #fff;

  814.       position: relative;

  815.       margin-bottom: 2%;

  816.       .return_btn{

  817.         width: 24px;

  818.         height: 43.2px;

  819.         background: url('../../../assets/images/sunVillage_info/list_icon_5.png') center center no-repeat;

  820.         background-size: 20px 36px;

  821.         position: absolute;

  822.         left: 38px;

  823.         top: 36px;

  824.       }

  825.       .add_btn{

  826.         width: 56.4px;

  827.         height: 40.8px;

  828.         background: url('../../../assets/images/sunVillage_info/list_icon_9.png') center center no-repeat;

  829.         background-size: 47px 34px;

  830.         position: absolute;

  831.         right: 38px;

  832.         top: 36px;

  833.       }

  834.     }

  835.   }

  836.   .main_title{

  837.     font-size: 0.4rem;

  838.     color: #1D6FE9;

  839.     margin: 0.2rem 6%;

  840.     position: relative;

  841.   }

  842.   .main_box{

  843.     width: 96%;

  844.     margin: 0 auto;

  845.     border-radius: 6px;

  846.     box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);

  847.     overflow: hidden;

  848.     background-color: #FFF;

  849.   }

  850.   .submitButton{

  851.     width: 80%;

  852.     margin: 0 auto;

  853.     background-color: #1D6FE9;

  854. 

  855.   }

  856.   .clear{

  857.     height: 80px;

  858.   }

  859.   .examine_box{

  860.     background-color: #1D6FE9!important;

  861.     padding: 0.18rem!important;

  862.     padding-left: 0!important;

  863.     border-radius: 0.15rem!important;

  864.     margin-top: 0.3rem!important;

  865.     .van-col:first-child{

  866.       color: #FFF!important;

  867.       font-size: 0.45rem!important;

  868.       text-align: center!important;

  869.     }

  870.     .van-col:last-child{

  871.       background-color: #FFF!important;

  872.       border-radius: 0.15rem!important;

  873.       overflow: hidden!important;

  874.       .van-radio-group--horizontal{

  875.         padding: 0.2rem 0;

  876.         border-bottom: 1px solid #eee;

  877.       }

  878.     }

  879.   }

  880. </style>