From 37ecc1245e5899a279a1f324586c5fcba75e8665 Mon Sep 17 00:00:00 2001
From: ZhaoTongYao <531131322@qq.com>
Date: Thu, 28 Jul 2022 19:04:52 +0800
Subject: [PATCH] 11

---
 .../rent/rentcontractinfo-add-or-update.vue   | 721 ++++++++++++++----
 .../rent/rentcontractinfo-look-or-check.vue   | 386 ++++++++++
 .../plugins/rent/rentcontractreview.vue       |  39 +-
 .../modules/plugins/rent/upload-image.vue     | 130 ++++
 4 files changed, 1119 insertions(+), 157 deletions(-)
 create mode 100644 src/views/modules/plugins/rent/rentcontractinfo-look-or-check.vue
 create mode 100644 src/views/modules/plugins/rent/upload-image.vue

diff --git a/src/views/modules/plugins/rent/rentcontractinfo-add-or-update.vue b/src/views/modules/plugins/rent/rentcontractinfo-add-or-update.vue
index 7dae7f23..be27c8e0 100644
--- a/src/views/modules/plugins/rent/rentcontractinfo-add-or-update.vue
+++ b/src/views/modules/plugins/rent/rentcontractinfo-add-or-update.vue
@@ -1,79 +1,202 @@
 <template>
-  <el-dialog class="rent" :visible.sync="visible" :title="dataForm.flag === '1' ? '查看详情' : '审核'" :close-on-click-modal="false" :close-on-press-escape="false">
+  <el-dialog class="rent" width="80%" top="5vh" :visible.sync="visible" :title="dataForm.flag === 'edit' ? '修改' : '新增'" :close-on-click-modal="false" :close-on-press-escape="false">
     <el-form :inline="true" :model="dataForm" :rules="dataRule" ref="dataForm"
-             @keyup.enter.native="dataFormSubmitHandle()" label-width="140px">
-        <div v-if="dataForm.flag === '2'">
-            <div style="margin-left: 50px;height: 30px;font-weight: bold;">房屋信息</div>
+             @keyup.enter.native="dataFormSubmitHandle()" label-width="100px">
+            <div style="margin-left: 30px;height: 30px;font-weight: bold;">房屋信息</div>
             <el-form-item label="所属社区" prop="gridName">
-                <el-input v-model="dataForm.gridName" placeholder="网格" disabled></el-input>
+              <el-select v-model.trim="dataForm.communityId"
+                placeholder="请选择"
+                clearable
+                @change="handleChangeAgency">
+                <el-option v-for="item in agencyOptions"
+                  :key="item.orgId"
+                  :label="item.orgName"
+                  :value="item.orgId">
+                </el-option>
+              </el-select>
             </el-form-item>
-            <el-form-item label="所属网格" prop="gridName">
-                <el-input v-model="dataForm.gridName" placeholder="所属网格" disabled></el-input>
+            <el-form-item label="所属网格" label-width="100px" prop="gridId">
+              <el-select v-model.trim="dataForm.gridId"
+                :disabled="changeCDisabled"
+                placeholder="请选择"
+                clearable
+                @change="handleChangeGrid">
+                <el-option v-for="item in gridOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
             </el-form-item>
-            <br/>
-            <el-form-item label="房屋" prop="homeName">
-                <el-input v-model="dataForm.homeName" placeholder="房屋" disabled></el-input>
+            <el-form-item label="所属小区" label-width="100px" prop="homeId">
+              <div class="resi-cell-value">
+                  <el-form-item prop="villageId">
+                    <el-select v-model.trim="dataForm.villageId"
+                      :disabled="changeGDisabled"
+                      placeholder="请选择小区"
+                      clearable
+                      @clear="handleClearVillage"
+                      @change="handleChangeV">
+                      <el-option v-for="item in villageOptions"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value">
+                      </el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item prop="buildId">
+                    <el-select v-model.trim="dataForm.buildId"
+                      :disabled="changeVDisabled"
+                      placeholder="楼号"
+                      clearable
+                      style="width: 120px;"
+                      @clear="handleClearBuild"
+                      @change="handleChangeB">
+                      <el-option v-for="item in buildingOptions"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value">
+                      </el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item prop="unitId">
+                    <el-select v-model.trim="dataForm.unitId"
+                      :disabled="changeBDisabled"
+                      placeholder="单元"
+                      clearable
+                      style="width: 120px;"
+                      @click="handleClearDan"
+                      @change="handleChangeD">
+                      <el-option v-for="item in unitOptions"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value">
+                      </el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item prop="homeId">
+                    <el-select v-model.trim="dataForm.homeId"
+                      :disabled="changeDDisabled"
+                      placeholder="房号"
+                      clearable
+                      style="width: 120px;"
+                      @change="handleChangeH">
+                      <el-option v-for="item in houseOptions"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value">
+                      </el-option>
+                    </el-select>
+                  </el-form-item>
+              </div>
             </el-form-item>
             <el-form-item label="房主姓名" prop="ownerName">
-                <el-input v-model="dataForm.ownerName" placeholder="房主姓名" disabled></el-input>
+                <el-input v-model="dataForm.ownerName" placeholder="房主姓名" style="width: 210px;"></el-input>
             </el-form-item>
-        </div>
         <div style="padding:20px 30px">
-          <div style="height: 30px;font-weight: bold;">居住成员信息</div>
+          <div style="font-weight: bold;">居住成员信息
+            <el-button @click="addMember()">添加成员</el-button>
+          </div>
           <el-table v-loading="dataListLoading" :data="dataForm.tenantList" border style="width: 100%">
               <el-table-column label="序号" header-align="center" align="center" width="50px">
                   <template slot-scope="scope">
                       {{scope.$index+1}}
                   </template>
               </el-table-column>
-              <el-table-column prop="name" label="姓名" header-align="center" align="center"></el-table-column>
-              <el-table-column prop="yfzgx" label="与户主关系" header-align="center" align="center" width="120"></el-table-column>
-              <el-table-column prop="mobile" label="手机" header-align="center" align="center" width="120"></el-table-column>
-              <el-table-column prop="idCard" label="身份证号" header-align="center" align="center" width="180"></el-table-column>
-              <el-table-column prop="unit" label="工作单位" header-align="center" align="center" width="180" show-overflow-tooltip></el-table-column>
-              <el-table-column prop="politicalStatus" label="政治面貌" header-align="center" align="center"></el-table-column>
-              <el-table-column prop="isMilitary" label="是否服过兵役" header-align="center" align="center" width="120"></el-table-column>
-              <el-table-column prop="nation" label="国籍" header-align="center" align="center"></el-table-column>
-              <el-table-column prop="idCardImgList" label="身份证照片" header-align="center" align="center">
+              <el-table-column prop="name" label="姓名" header-align="center" align="center">
+                <template slot-scope="scope">
+                  <el-input v-model="dataForm.tenantList[scope.$index].name"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="yfzgx" label="与户主关系" header-align="center" align="center" width="120">
+                <template slot-scope="scope">
+                  <el-input v-model="dataForm.tenantList[scope.$index].yfzgx" placeholder="租客"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="mobile" label="手机" header-align="center" align="center" width="120">
+                <template slot-scope="scope">
+                  <el-input v-model="dataForm.tenantList[scope.$index].mobile"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="idCard" label="身份证号" header-align="center" align="center" width="180">
+                <template slot-scope="scope">
+                  <el-input v-model="dataForm.tenantList[scope.$index].idCard"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="unit" label="工作单位" header-align="center" align="center" width="180" show-overflow-tooltip>
+                <template slot-scope="scope">
+                  <el-input v-model="dataForm.tenantList[scope.$index].unit"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="politicalStatus" label="政治面貌" header-align="center" align="center">
+                <template slot-scope="scope">
+                  <el-select v-model="dataForm.tenantList[scope.$index].politicalStatus" placeholder="请选择">
+                    <el-option
+                      v-for="item in zzmmOptions"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value">
+                    </el-option>
+                  </el-select>
+                </template>
+              </el-table-column>
+              <el-table-column prop="isMilitary" label="是否服过兵役" header-align="center" align="center" width="120">
+                <template slot-scope="scope">
+                  <el-select v-model="dataForm.tenantList[scope.$index].isMilitary" placeholder="请选择">
+                    <el-option
+                      v-for="item in shifouOptions"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value">
+                    </el-option>
+                  </el-select>
+                </template>
+              </el-table-column>
+              <el-table-column prop="nation" label="国籍" header-align="center" align="center">
+                <template slot-scope="scope">
+                  <el-select v-model="dataForm.tenantList[scope.$index].nation" placeholder="请选择">
+                    <el-option
+                      v-for="item in nationOptions"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value">
+                    </el-option>
+                  </el-select>
+                </template>
+              </el-table-column>
+              <el-table-column label="身份证照片" header-align="center" align="center" width="245px">
                   <template slot-scope="scope">
-                      <div v-for="(item,index) in scope.row.idCardImgList" :key="index">
-                          <img :src="item.fileUrl" @click="imgShow(item.fileUrl)" width="40" height="40"  />
-                      </div>
+                    <upload-image :defaultFileList="dataForm.tenantList[scope.$index].idCardImgList" :limit="2" :rowIndex="scope.$index" @change="onChangeTenantListIdImgList"></upload-image>
                   </template>
               </el-table-column>
-              <el-table-column prop="imgList" label="照片" header-align="center" align="center">
+              <el-table-column prop="imgList" label="照片" header-align="center" align="center" width="215px">
                   <template slot-scope="scope">
-                      <div v-for="(item,index) in scope.row.imgList" :key="index">
-                          <img :src="item.fileUrl" @click="imgShow(item.fileUrl)" width="40" height="40"  />
-                      </div>
+                    <upload-image :defaultFileList="dataForm.tenantList[scope.$index].imgList" :limit="3" :rowIndex="scope.$index" @change="onChangeImgList"></upload-image>
                   </template>
               </el-table-column>
           </el-table>
         </div>
-        <div style="margin-left: 50px;height: 30px;font-weight: bold;">合同信息</div>
+        <div style="margin-left: 30px;height: 30px;font-weight: bold;">合同信息</div>
         <div style="margin-left: 50px;height: 30px;">出租人信息</div>
-        <el-form-item label="出租人姓名" prop="lessorName">
-            <el-input v-model="dataForm.lessorName" placeholder="出租人姓名" disabled></el-input>
+        <el-form-item label="出租人姓名" prop="lessorName" label-width="140px">
+            <el-input v-model="dataForm.lessorName" placeholder="出租人姓名"></el-input>
         </el-form-item>
-        <el-form-item label="出租人身份证" prop="lessorIdCard">
-            <el-input v-model="dataForm.lessorIdCard" placeholder="出租人身份证" disabled></el-input>
+        <el-form-item label="出租人身份证" prop="lessorIdCard" label-width="140px">
+            <el-input v-model="dataForm.lessorIdCard" placeholder="出租人身份证"></el-input>
         </el-form-item>
-        <br/>
-        <el-form-item label="出租人手机" prop="lessorMobile">
-            <el-input v-model="dataForm.lessorMobile" placeholder="出租人手机" disabled></el-input>
+        <el-form-item label="出租人手机" prop="lessorMobile" label-width="140px">
+            <el-input v-model="dataForm.lessorMobile" placeholder="出租人手机"></el-input>
         </el-form-item>
-        <el-form-item label="与房主关系" prop="lessorRelation">
+        <el-form-item label="与房主关系" prop="lessorRelation" label-width="140px">
             <!--<el-input v-model="dataForm.lessorRelation" placeholder="与房主关系"></el-input>-->
-            <el-select v-model="dataForm.lessorRelation" placeholder="与房主关系" :disabled="dataForm.state !== '0'">
+            <el-select v-model="dataForm.lessorRelation" placeholder="与房主关系">
                 <el-option v-for="item in lessorRelationArr" :key="item.dictValue" :label="item.dictName" :value="item.dictValue">
                 </el-option>
             </el-select>
         </el-form-item>
-        <br/>
-        <el-form-item label="出租人现居住地" prop="lessorLiveAddress">
-            <el-input v-model="dataForm.lessorLiveAddress" placeholder="出租人现居住地" disabled></el-input>
+        <el-form-item label="出租人现居住地" prop="lessorLiveAddress" label-width="140px">
+            <el-input v-model="dataForm.lessorLiveAddress" placeholder="出租人现居住地" ></el-input>
         </el-form-item>
-        <br/>
         <el-form-item label="中介合同附件" prop="agencyImgList" v-if="dataForm.lessorRelation ==='中介'">
             <template>
                 <label v-for="(item,index) in dataForm.agencyImgList" :key="index">
@@ -84,76 +207,55 @@
         <br/>
 
         <div style="margin-left: 50px;height: 30px;">承租人信息</div>
-        <el-form-item label="承租人姓名" prop="lesseeName">
-            <el-input v-model="dataForm.lesseeName" placeholder="承租人姓名" disabled></el-input>
+        <el-form-item label="承租人姓名" prop="lesseeName" label-width="140px">
+            <el-input v-model="dataForm.lesseeName" placeholder="承租人姓名" ></el-input>
         </el-form-item>
-        <el-form-item label="承租人身份证" prop="lesseeIdCard">
-            <el-input v-model="dataForm.lesseeIdCard" placeholder="承租人身份证" disabled></el-input>
+        <el-form-item label="承租人身份证" prop="lesseeIdCard" label-width="140px">
+            <el-input v-model="dataForm.lesseeIdCard" placeholder="承租人身份证" ></el-input>
         </el-form-item>
-        <br/>
-        <el-form-item label="承租人手机" prop="lesseeMobile">
-            <el-input v-model="dataForm.lesseeMobile" placeholder="承租人手机" disabled></el-input>
+        <el-form-item label="承租人手机" prop="lesseeMobile" label-width="140px">
+            <el-input v-model="dataForm.lesseeMobile" placeholder="承租人手机" ></el-input>
         </el-form-item>
-        <el-form-item label="工作单位" prop="lesseeUnit">
-            <el-input v-model="dataForm.lesseeUnit" placeholder="工作单位" disabled></el-input>
+        <el-form-item label="工作单位" prop="lesseeUnit" label-width="140px">
+            <el-input v-model="dataForm.lesseeUnit" placeholder="工作单位" ></el-input>
         </el-form-item>
-        <br/>
-        <el-form-item label="承租人户籍地" prop="lesseeHouseAddress">
-            <el-input v-model="dataForm.lesseeHouseAddress" placeholder="承租人户籍地" disabled></el-input>
+        <el-form-item label="承租人户籍地" prop="lesseeHouseAddress" label-width="140px">
+            <el-input v-model="dataForm.lesseeHouseAddress" placeholder="承租人户籍地" ></el-input>
         </el-form-item>
         <br/>
 
-
-        <div style="margin-left: 50px;height: 30px;font-weight: bold;">合同内容</div>
-        <el-form-item label="签署日期" prop="signDate">
-            <el-input v-model="dataForm.signDate" placeholder="签署日期" disabled></el-input>
+        <div style="margin-left: 30px;height: 30px;font-weight: bold;">合同内容</div>
+        <el-form-item label="签署日期" prop="signDate" label-width="140px">
+            <el-input v-model="dataForm.signDate" placeholder="签署日期" ></el-input>
         </el-form-item>
-        <br/>
-        <el-form-item label="合同开始日期" prop="startDate">
-            <el-input v-model="dataForm.startDate" placeholder="合同开始日期" disabled></el-input>
+        <el-form-item label="合同开始日期" prop="startDate" label-width="140px">
+            <el-input v-model="dataForm.startDate" placeholder="合同开始日期" ></el-input>
         </el-form-item>
-        <el-form-item label="合同结束日期" prop="endDate">
-            <el-input v-model="dataForm.endDate" placeholder="合同结束日期" disabled></el-input>
+        <el-form-item label="合同结束日期" prop="endDate" label-width="140px">
+            <el-input v-model="dataForm.endDate" placeholder="合同结束日期" ></el-input>
         </el-form-item>
         <br/>
 
-        <el-form-item label="合同附件" prop="fileList">
-            <template>
-                <label v-for="(item,index) in dataForm.fileList" :key="index">
-                    <img :src="item.fileUrl" @click="imgShow(item.fileUrl)" width="100" height="100" />
-                </label>
-            </template>
+        <el-form-item label="合同附件" prop="fileList" label-width="140px">
+          <template>
+            <upload-image :defaultFileList="dataForm.fileList" :limit="6" @change="onChangeFileList"></upload-image>
+          </template>
         </el-form-item>
-        <el-form-item label="审核原因" prop="reason" v-if="dataForm.flag === '1' && dataForm.state === '2'">
-            <el-input v-model="dataForm.reason" placeholder="审核原因" disabled></el-input>
-        </el-form-item>
-
       </el-form>
     <template slot="footer">
         <div class="resi-btns">
-        <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-        <el-button v-if="dataForm.state === '0'" type="danger" @click="openCheckReasonDialog">{{ $t('checkBTGBtn') }}</el-button>
-        <el-button v-if="dataForm.state === '0'" type="primary" @click="checkHandle('1')">{{ $t('checkTGBtn') }}</el-button>
+          <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
+          <el-button @click="dataFormSubmitHandle">提交</el-button>
         </div>
     </template>
       <el-dialog :visible.sync="dialogVisible" :modal="false">
           <img width="100%" :src="dialogImageUrl" alt="">
       </el-dialog>
-      <el-dialog
-              title="审核不通过原因"
-              :visible.sync="checkVisible"
-              width="30%"
-              append-to-body>
-          <el-input v-model="checkReason" placeholder="请输入审核不通过原因"></el-input>
-          <span slot="footer" class="dialog-footer">
-            <el-button @click="checkVisible = false">取 消</el-button>
-            <el-button type="primary" @click="dialogCheckHandle" :disabled="disabledBtn">确 定</el-button>
-          </span>
-      </el-dialog>
   </el-dialog>
 </template>
 
 <script>
+import UploadImage from './upload-image.vue'
 import debounce from 'lodash/debounce'
 export default {
   data () {
@@ -161,9 +263,13 @@ export default {
       visible: false,
       dataForm: {
         id: '',
-        flag: '',
+        flag: '', // 新增，修改
+        communityId: '',
+        communityName: '',
         gridId: '',
         gridName: '',
+        villageId: '',
+        villageName: '',
         buildId: '',
         buildName: '',
         unitId: '',
@@ -184,8 +290,35 @@ export default {
           lesseeHouseAddress: '',
         signDate: '',
         startDate: '',
-        endDate: ''
+        endDate: '',
+        tenantList: [{
+          id: '',
+          name: '',
+          idCard: '',
+          mobile: '',
+          yfzgx: '',
+          type: 1,
+          politicalStatus: '',
+          isMilitary: '',
+          nation: '',
+          imgList: [],
+          idCardImgList: [],
+          unit: ''
+        }],
+        fileList: []
       },
+      zzmmOptions: [
+        { name: '党员', value: '党员' },
+        { name: '群众', value: '群众' }
+      ],
+      shifouOptions: [
+        { name: '是', value: '是' },
+        { name: '否', value: '否' }
+      ],
+      nationOptions: [
+        { name: '中国', value: '中国' },
+        { name: '其他', value: '其他' }
+      ],
         dataListLoading: false,
         dialogVisible: false,
         dialogImageUrl: '',
@@ -201,9 +334,14 @@ export default {
             { dictValue: '兄弟姐妹', dictName: '兄弟姐妹' },
             { dictValue: '中介', dictName: '中介' }
         ],
-        checkReason: '',
         checkVisible: false,
-        disabledBtn: false
+        disabledBtn: false,
+        gridOptions: [],
+        villageOptions: [],
+        buildingOptions: [],
+        unitOptions: [],
+        houseOptions: [],
+        agencyOptions: []
     }
   },
   computed: {
@@ -267,23 +405,353 @@ export default {
           { required: true, message: this.$t('validate.required'), trigger: 'blur' }
         ]
       }
+    },
+    changeCDisabled() {
+      return !this.dataForm.communityId
+    },
+    changeGDisabled() {
+      return !this.dataForm.gridId
+    },
+    changeVDisabled() {
+      return !this.dataForm.villageId
+    },
+    changeBDisabled() {
+      return !this.dataForm.buildId
+    },
+    changeDDisabled() {
+      return !this.dataForm.unitId
     }
   },
   methods: {
+    dataFormReset() {
+      this.dataForm = {
+        id: this.dataForm.flag == 'edit' ? this.dataForm.id : '',
+        flag: this.dataForm.flag == 'edit' ? this.dataForm.flag : '',
+        communityId: '',
+        communityName: '',
+        gridId: '',
+        gridName: '',
+        villageId: '',
+        villageName: '',
+        buildId: '',
+        buildName: '',
+        unitId: '',
+        unitName: '',
+        homeId: '',
+        homeName: '',
+        ownerName: '',
+        state: '',
+        lessorName: '',
+        lessorIdCard: '',
+        lessorMobile: '',
+        lessorRelation: '',
+        lessorLiveAddress: '',
+        lesseeName: '',
+        lesseeIdCard: '',
+        lesseeMobile: '',
+        lesseeUnit: '',
+        lesseeHouseAddress: '',
+        signDate: '',
+        startDate: '',
+        endDate: '',
+        tenantList: [{
+          id: '',
+          name: '',
+          idCard: '',
+          mobile: '',
+          yfzgx: '',
+          type: 1,
+          politicalStatus: '',
+          isMilitary: '',
+          nation: '',
+          imgList: [],
+          idCardImgList: [],
+          unit: ''
+        }],
+        fileList: []
+      }
+    },
     init () {
       this.visible = true
       this.$nextTick(() => {
         this.$refs['dataForm'].resetFields()
+        this.dataFormReset()
         if (this.dataForm.id) {
           this.getInfo()
+        } else {
+          this.getAgencyList()
         }
       })
     },
-      // 查看大图
-      imgShow(url){
-        this.dialogImageUrl = url
-          this.dialogVisible = true
-      },
+    onChangeTenantListIdImgList (e, rowIndex=0) {
+      console.log('onChangeTenantListIdImgList', e)
+      if (e.length > 0) {
+        this.dataForm.tenantList[rowIndex].idCardImgList = []
+        e.forEach(item => {
+          let ob = {
+            fileType: '3',
+            fileUrl: item.response.data.url
+          }
+          this.dataForm.tenantList[rowIndex].idCardImgList.push(ob)
+        })
+      }
+    },
+    onChangeImgList (e, rowIndex=0) {
+      console.log('onChangeImgList', e)
+      if (e.length > 0) {
+        this.dataForm.tenantList[rowIndex].imgList = []
+        e.forEach(item => {
+          let ob = {
+            fileType: '0',
+            fileUrl: item.response.data.url
+          }
+          this.dataForm.tenantList[rowIndex].imgList.push(ob)
+        })
+      }
+    },
+    onChangeFileList (e, rowIndex=0) {
+      console.log('onChangeFileList', e)
+      if (e.length > 0) {
+        this.dataForm.fileList = []
+        e.forEach(item => {
+          let ob = {
+            fileType: '0',
+            fileUrl: item.response.data.url
+          }
+          this.dataForm.fileList.push(ob)
+        })
+      }
+    },
+    addMember () {
+      let ob = {
+        id: '',
+        name: '',
+        idCard: '',
+        mobile: '',
+        yfzgx: '',
+        type: 1,
+        politicalStatus: '',
+        isMilitary: '',
+        nation: '',
+        imgList: [],
+        idCardImgList: [],
+        unit: ''
+      }
+      this.dataForm.tenantList.push(ob)
+    },
+    // 查看大图
+    imgShow(url){
+      this.dialogImageUrl = url
+        this.dialogVisible = true
+    },
+
+    handleClearVillage() {
+      this.dataForm.buildId = ''
+      this.dataForm.homeId = ''
+    },
+    handleClearBuild() {
+      this.dataForm.buildId = ''
+      this.dataForm.unitId = ''
+      this.dataForm.homeId = ''
+    },
+    handleClearDan() {
+      this.dataForm.unitId = ''
+      this.dataForm.homeId = ''
+    },
+    handleChangeH (val) {
+      this.dataForm.homeName = this.getOptionsName(val, this.houseOptions)
+      this.getOwnerInfo()
+    },
+    handleChangeD(val) {
+      this.dataForm.homeId = ''
+      this.dataForm.unitName = this.getOptionsName(val, this.unitOptions)
+      this.getHouseList()
+    },
+    handleChangeB(val) {
+      this.dataForm.unitId = ''
+      this.dataForm.homeId = ''
+      this.dataForm.buildName = this.getOptionsName(val, this.buildingOptions)
+      this.getUniList()
+    },
+    handleChangeV(val) {
+      this.dataForm.buildId = ''
+      this.dataForm.unitId = ''
+      this.dataForm.homeId = ''
+      this.dataForm.villageName = this.getOptionsName(val, this.villageOptions)
+      this.getBuildList()
+    },
+    handleChangeGrid(val) {
+      this.dataForm.villageId = ''
+      this.dataForm.buildId = ''
+      this.dataForm.unitId = ''
+      this.dataForm.homeId = ''
+      this.dataForm.gridName = this.getOptionsName(val, this.gridOptions)
+      this.getVillageList()
+    },
+    handleChangeAgency (val) {
+      this.dataForm.gridId = ''
+      this.dataForm.villageId = ''
+      this.dataForm.buildId = ''
+      this.dataForm.unitId = ''
+      this.dataForm.homeId = ''
+      this.dataForm.communityName = this.getOptionsName(val, this.agencyOptions, 'orgName', 'orgId')
+      this.getGridList()
+    },
+    getOptionsName (value, options, labelKey='label', valueKey='value') {
+      let optionsName = ''
+      if (options.length > 0) {
+        options.forEach(item => {
+          if (item[valueKey] == value) {
+            optionsName = item[labelKey]
+          }
+        })
+      }
+      return optionsName
+    },
+    async editModeGetList () {
+      await this.getAgencyList()
+      await this.getGridList()
+      await this.getVillageList()
+      await this.getBuildList()
+      await this.getUniList()
+      await this.getHouseList()
+      await this.getOwnerInfo()
+    },
+    getAgencyList() {
+      return new Promise((resolve, reject) => {
+        this.$http.post('/gov/org/agency/communityListByCustomerId')
+          .then(({ data: res }) => {
+            if (res.code !== 0) {
+            reject(false)
+              return this.$message.error(res.msg)
+            } else {
+              console.log('获取查询详情成功', res.data)
+              this.agencyOptions = res.data
+              resolve(true)
+            }
+          })
+          .catch(() => {
+            reject(false)
+            return this.$message.error('网络错误')
+          })
+      })
+    },
+    getGridList() {
+      return new Promise((resolve, reject) => {
+        this.$http.post('/gov/org/customergrid/gridoption', { agencyId: this.dataForm.communityId, purpose: 'query' })
+          .then(({ data: res }) => {
+            if (res.code !== 0) {
+              reject(false)
+              return this.$message.error(res.msg)
+            } else {
+              console.log('获取查询详情成功', res.data)
+              this.gridOptions = res.data
+              resolve(true)
+            }
+          })
+          .catch(() => {
+            reject(false)
+            return this.$message.error('网络错误')
+          })
+      })
+    },
+    getVillageList() {
+      return new Promise((resolve, reject) => {
+        this.$http.post('/gov/org/icneighborhood/neighborhoodoption', {
+          gridId: this.dataForm.gridId,
+          agencyId: ''
+          // agencyId: user.agencyId
+        })
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            reject(false)
+            return this.$message.error(res.msg)
+          } else {
+            console.log('获取查询详情成功', res.data)
+            this.villageOptions = res.data
+            resolve(true)
+          }
+        })
+        .catch(() => {
+            reject(false)
+          return this.$message.error('网络错误')
+        })
+      })
+    },
+    getBuildList() {
+      return new Promise((resolve, reject) => {
+        this.$http.post('/gov/org/icbuilding/buildingoption', {
+          neighborHoodId: this.dataForm.villageId
+        })
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            reject(false)
+            return this.$message.error(res.msg)
+          } else {
+            console.log('获取查询详情成功', res.data)
+            this.buildingOptions = res.data
+            resolve(true)
+          }
+        })
+        .catch(() => {
+          reject(false)
+          return this.$message.error('网络错误')
+        })
+      })
+    },
+    getUniList() {
+      return new Promise((resolve, reject) => {
+        this.$http.post('/gov/org/icbuildingunit/unitoption', {
+          buildingId: this.dataForm.buildId
+        })
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            reject(false)
+            return this.$message.error(res.msg)
+          } else {
+            console.log('获取查询详情成功', res.data)
+            this.unitOptions = res.data
+            resolve(true)
+          }
+        })
+        .catch(() => {
+          reject(false)
+          return this.$message.error('网络错误')
+        })
+      })
+    },
+    getHouseList() {
+      return new Promise((resolve, reject) => {
+        this.$http.post('/gov/org/ichouse/houseoption', { unitId: this.dataForm.unitId })
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            reject(false)
+            return this.$message.error(res.msg)
+          } else {
+            console.log('获取查询详情成功', res.data)
+            this.houseOptions = res.data
+            resolve(true)
+          }
+        })
+        .catch(() => {
+          reject(false)
+          return this.$message.error('网络错误')
+        })
+      })
+    },
+    // 获取房主姓名
+    getOwnerInfo () {
+      return new Promise((resolve, reject) => {
+        this.$http.get(`/gov/org/ichouse/${this.dataForm.homeId}`).then(({ data: res }) => {
+          if (res.code !== 0) {
+            reject(false)
+            return this.$message.error(res.msg)
+          }
+          this.dataForm.ownerName = res.data.ownerName
+          resolve(true)
+        }).catch(() => {})
+      })
+    },
     // 获取信息
     getInfo () {
       this.$http.get(`/pli/power/rentContractInfo/${this.dataForm.id}`).then(({ data: res }) => {
@@ -292,67 +760,19 @@ export default {
         }
         this.dataForm = {
           ...this.dataForm,
-          ...res.data
+          ...res.data,
         }
+        this.editModeGetList()
       }).catch(() => {})
     },
-      // 打开审核不通过对话框
-      openCheckReasonDialog(){
-        this.checkVisible = true
-          this.checkReason = ''
-          this.disabledBtn = false
-      },
-      // 不通过审核意见提交
-      dialogCheckHandle(){
-        if(this.checkReason === ''){
-            return this.$message.error('请填写不通过原因')
-        }
-        this.checkHandle('2')
-          this.disabledBtn = true
-      },
-      // 审核提交方法
-      checkHandle: function (type) {
-        const params = {
-          id: this.dataForm.id,
-          state: type,
-          homeId: this.dataForm.homeId,
-          lessorRelation: this.dataForm.lessorRelation,
-          reason: this.checkReason
-        }
-        this.$http.post('/pli/power/rentContractInfo/review', params).then(({ data: res }) => {
-          if (res.code !== 0) {
-            return this.$message.error(res.msg)
-          }
-          // 调用文件下发权限接口
-          this.fileJurisdiction(params)
-        }).catch(() => {})
-      },
-      // 文件下发权限接口
-      fileJurisdiction (params) {
-          this.$http.post('/pli/power/rentContractInfo/send', params).then(({ data: res }) => {
-              if (res.code !== 0) {
-                  return this.$message.error(res.msg)
-              }
-              this.$message({
-                  message: this.$t('prompt.success'),
-                  type: 'success',
-                  duration: 500,
-                  onClose: () => {
-                      this.disabledBtn = false
-                      this.checkVisible = false
-                      this.visible = false
-                      this.$emit('refreshDataList')
-                  }
-              })
-          }).catch(() => {})
-      },
     // 表单提交
     dataFormSubmitHandle: debounce(function () {
       this.$refs['dataForm'].validate((valid) => {
         if (!valid) {
           return false
         }
-        this.$http[!this.dataForm.id ? 'post' : 'put']('/pli/power/rentContractInfo/', this.dataForm).then(({ data: res }) => {
+        const url = this.dataForm.flag == 'edit' ? '/pli/power/rentContractInfo/savePc' : '/pli/power/rentContractInfo/updatePc'
+        this.$http[!this.dataForm.id ? 'post' : 'put'](url, this.dataForm).then(({ data: res }) => {
           if (res.code !== 0) {
             return this.$message.error(res.msg)
           }
@@ -368,6 +788,9 @@ export default {
         }).catch(() => {})
       })
     }, 1000, { 'leading': true, 'trailing': false })
+  },
+  components: {
+    UploadImage
   }
 }
 </script>
diff --git a/src/views/modules/plugins/rent/rentcontractinfo-look-or-check.vue b/src/views/modules/plugins/rent/rentcontractinfo-look-or-check.vue
new file mode 100644
index 00000000..7dae7f23
--- /dev/null
+++ b/src/views/modules/plugins/rent/rentcontractinfo-look-or-check.vue
@@ -0,0 +1,386 @@
+<template>
+  <el-dialog class="rent" :visible.sync="visible" :title="dataForm.flag === '1' ? '查看详情' : '审核'" :close-on-click-modal="false" :close-on-press-escape="false">
+    <el-form :inline="true" :model="dataForm" :rules="dataRule" ref="dataForm"
+             @keyup.enter.native="dataFormSubmitHandle()" label-width="140px">
+        <div v-if="dataForm.flag === '2'">
+            <div style="margin-left: 50px;height: 30px;font-weight: bold;">房屋信息</div>
+            <el-form-item label="所属社区" prop="gridName">
+                <el-input v-model="dataForm.gridName" placeholder="网格" disabled></el-input>
+            </el-form-item>
+            <el-form-item label="所属网格" prop="gridName">
+                <el-input v-model="dataForm.gridName" placeholder="所属网格" disabled></el-input>
+            </el-form-item>
+            <br/>
+            <el-form-item label="房屋" prop="homeName">
+                <el-input v-model="dataForm.homeName" placeholder="房屋" disabled></el-input>
+            </el-form-item>
+            <el-form-item label="房主姓名" prop="ownerName">
+                <el-input v-model="dataForm.ownerName" placeholder="房主姓名" disabled></el-input>
+            </el-form-item>
+        </div>
+        <div style="padding:20px 30px">
+          <div style="height: 30px;font-weight: bold;">居住成员信息</div>
+          <el-table v-loading="dataListLoading" :data="dataForm.tenantList" border style="width: 100%">
+              <el-table-column label="序号" header-align="center" align="center" width="50px">
+                  <template slot-scope="scope">
+                      {{scope.$index+1}}
+                  </template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名" header-align="center" align="center"></el-table-column>
+              <el-table-column prop="yfzgx" label="与户主关系" header-align="center" align="center" width="120"></el-table-column>
+              <el-table-column prop="mobile" label="手机" header-align="center" align="center" width="120"></el-table-column>
+              <el-table-column prop="idCard" label="身份证号" header-align="center" align="center" width="180"></el-table-column>
+              <el-table-column prop="unit" label="工作单位" header-align="center" align="center" width="180" show-overflow-tooltip></el-table-column>
+              <el-table-column prop="politicalStatus" label="政治面貌" header-align="center" align="center"></el-table-column>
+              <el-table-column prop="isMilitary" label="是否服过兵役" header-align="center" align="center" width="120"></el-table-column>
+              <el-table-column prop="nation" label="国籍" header-align="center" align="center"></el-table-column>
+              <el-table-column prop="idCardImgList" label="身份证照片" header-align="center" align="center">
+                  <template slot-scope="scope">
+                      <div v-for="(item,index) in scope.row.idCardImgList" :key="index">
+                          <img :src="item.fileUrl" @click="imgShow(item.fileUrl)" width="40" height="40"  />
+                      </div>
+                  </template>
+              </el-table-column>
+              <el-table-column prop="imgList" label="照片" header-align="center" align="center">
+                  <template slot-scope="scope">
+                      <div v-for="(item,index) in scope.row.imgList" :key="index">
+                          <img :src="item.fileUrl" @click="imgShow(item.fileUrl)" width="40" height="40"  />
+                      </div>
+                  </template>
+              </el-table-column>
+          </el-table>
+        </div>
+        <div style="margin-left: 50px;height: 30px;font-weight: bold;">合同信息</div>
+        <div style="margin-left: 50px;height: 30px;">出租人信息</div>
+        <el-form-item label="出租人姓名" prop="lessorName">
+            <el-input v-model="dataForm.lessorName" placeholder="出租人姓名" disabled></el-input>
+        </el-form-item>
+        <el-form-item label="出租人身份证" prop="lessorIdCard">
+            <el-input v-model="dataForm.lessorIdCard" placeholder="出租人身份证" disabled></el-input>
+        </el-form-item>
+        <br/>
+        <el-form-item label="出租人手机" prop="lessorMobile">
+            <el-input v-model="dataForm.lessorMobile" placeholder="出租人手机" disabled></el-input>
+        </el-form-item>
+        <el-form-item label="与房主关系" prop="lessorRelation">
+            <!--<el-input v-model="dataForm.lessorRelation" placeholder="与房主关系"></el-input>-->
+            <el-select v-model="dataForm.lessorRelation" placeholder="与房主关系" :disabled="dataForm.state !== '0'">
+                <el-option v-for="item in lessorRelationArr" :key="item.dictValue" :label="item.dictName" :value="item.dictValue">
+                </el-option>
+            </el-select>
+        </el-form-item>
+        <br/>
+        <el-form-item label="出租人现居住地" prop="lessorLiveAddress">
+            <el-input v-model="dataForm.lessorLiveAddress" placeholder="出租人现居住地" disabled></el-input>
+        </el-form-item>
+        <br/>
+        <el-form-item label="中介合同附件" prop="agencyImgList" v-if="dataForm.lessorRelation ==='中介'">
+            <template>
+                <label v-for="(item,index) in dataForm.agencyImgList" :key="index">
+                    <img :src="item.fileUrl" @click="imgShow(item.fileUrl)" width="100" height="100" />
+                </label>
+            </template>
+        </el-form-item>
+        <br/>
+
+        <div style="margin-left: 50px;height: 30px;">承租人信息</div>
+        <el-form-item label="承租人姓名" prop="lesseeName">
+            <el-input v-model="dataForm.lesseeName" placeholder="承租人姓名" disabled></el-input>
+        </el-form-item>
+        <el-form-item label="承租人身份证" prop="lesseeIdCard">
+            <el-input v-model="dataForm.lesseeIdCard" placeholder="承租人身份证" disabled></el-input>
+        </el-form-item>
+        <br/>
+        <el-form-item label="承租人手机" prop="lesseeMobile">
+            <el-input v-model="dataForm.lesseeMobile" placeholder="承租人手机" disabled></el-input>
+        </el-form-item>
+        <el-form-item label="工作单位" prop="lesseeUnit">
+            <el-input v-model="dataForm.lesseeUnit" placeholder="工作单位" disabled></el-input>
+        </el-form-item>
+        <br/>
+        <el-form-item label="承租人户籍地" prop="lesseeHouseAddress">
+            <el-input v-model="dataForm.lesseeHouseAddress" placeholder="承租人户籍地" disabled></el-input>
+        </el-form-item>
+        <br/>
+
+
+        <div style="margin-left: 50px;height: 30px;font-weight: bold;">合同内容</div>
+        <el-form-item label="签署日期" prop="signDate">
+            <el-input v-model="dataForm.signDate" placeholder="签署日期" disabled></el-input>
+        </el-form-item>
+        <br/>
+        <el-form-item label="合同开始日期" prop="startDate">
+            <el-input v-model="dataForm.startDate" placeholder="合同开始日期" disabled></el-input>
+        </el-form-item>
+        <el-form-item label="合同结束日期" prop="endDate">
+            <el-input v-model="dataForm.endDate" placeholder="合同结束日期" disabled></el-input>
+        </el-form-item>
+        <br/>
+
+        <el-form-item label="合同附件" prop="fileList">
+            <template>
+                <label v-for="(item,index) in dataForm.fileList" :key="index">
+                    <img :src="item.fileUrl" @click="imgShow(item.fileUrl)" width="100" height="100" />
+                </label>
+            </template>
+        </el-form-item>
+        <el-form-item label="审核原因" prop="reason" v-if="dataForm.flag === '1' && dataForm.state === '2'">
+            <el-input v-model="dataForm.reason" placeholder="审核原因" disabled></el-input>
+        </el-form-item>
+
+      </el-form>
+    <template slot="footer">
+        <div class="resi-btns">
+        <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
+        <el-button v-if="dataForm.state === '0'" type="danger" @click="openCheckReasonDialog">{{ $t('checkBTGBtn') }}</el-button>
+        <el-button v-if="dataForm.state === '0'" type="primary" @click="checkHandle('1')">{{ $t('checkTGBtn') }}</el-button>
+        </div>
+    </template>
+      <el-dialog :visible.sync="dialogVisible" :modal="false">
+          <img width="100%" :src="dialogImageUrl" alt="">
+      </el-dialog>
+      <el-dialog
+              title="审核不通过原因"
+              :visible.sync="checkVisible"
+              width="30%"
+              append-to-body>
+          <el-input v-model="checkReason" placeholder="请输入审核不通过原因"></el-input>
+          <span slot="footer" class="dialog-footer">
+            <el-button @click="checkVisible = false">取 消</el-button>
+            <el-button type="primary" @click="dialogCheckHandle" :disabled="disabledBtn">确 定</el-button>
+          </span>
+      </el-dialog>
+  </el-dialog>
+</template>
+
+<script>
+import debounce from 'lodash/debounce'
+export default {
+  data () {
+    return {
+      visible: false,
+      dataForm: {
+        id: '',
+        flag: '',
+        gridId: '',
+        gridName: '',
+        buildId: '',
+        buildName: '',
+        unitId: '',
+        unitName: '',
+        homeId: '',
+        homeName: '',
+        ownerName: '',
+        state: '',
+        lessorName: '',
+        lessorIdCard: '',
+        lessorMobile: '',
+        lessorRelation: '',
+          lessorLiveAddress: '',
+        lesseeName: '',
+        lesseeIdCard: '',
+        lesseeMobile: '',
+        lesseeUnit: '',
+          lesseeHouseAddress: '',
+        signDate: '',
+        startDate: '',
+        endDate: ''
+      },
+        dataListLoading: false,
+        dialogVisible: false,
+        dialogImageUrl: '',
+        lessorRelationArr: [
+            { dictValue: '本人', dictName: '本人' },
+            { dictValue: '配偶', dictName: '配偶' },
+            { dictValue: '子女', dictName: '子女' },
+            { dictValue: '父母', dictName: '父母' },
+            { dictValue: '岳父母或公婆', dictName: '岳父母或公婆' },
+            { dictValue: '祖父母', dictName: '祖父母' },
+            { dictValue: '媳婿', dictName: '媳婿' },
+            { dictValue: '孙子女', dictName: '孙子女' },
+            { dictValue: '兄弟姐妹', dictName: '兄弟姐妹' },
+            { dictValue: '中介', dictName: '中介' }
+        ],
+        checkReason: '',
+        checkVisible: false,
+        disabledBtn: false
+    }
+  },
+  computed: {
+    dataRule () {
+      return {
+        gridId: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        gridName: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        buildId: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        buildName: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        unitId: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        unitName: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        homeId: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        homeName: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        ownerName: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        state: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        lessorName: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        lessorIdCard: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        lessorMobile: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        lesseeName: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        lesseeIdCard: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        lesseeMobile: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        signDate: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        startDate: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ],
+        endDate: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  methods: {
+    init () {
+      this.visible = true
+      this.$nextTick(() => {
+        this.$refs['dataForm'].resetFields()
+        if (this.dataForm.id) {
+          this.getInfo()
+        }
+      })
+    },
+      // 查看大图
+      imgShow(url){
+        this.dialogImageUrl = url
+          this.dialogVisible = true
+      },
+    // 获取信息
+    getInfo () {
+      this.$http.get(`/pli/power/rentContractInfo/${this.dataForm.id}`).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.dataForm = {
+          ...this.dataForm,
+          ...res.data
+        }
+      }).catch(() => {})
+    },
+      // 打开审核不通过对话框
+      openCheckReasonDialog(){
+        this.checkVisible = true
+          this.checkReason = ''
+          this.disabledBtn = false
+      },
+      // 不通过审核意见提交
+      dialogCheckHandle(){
+        if(this.checkReason === ''){
+            return this.$message.error('请填写不通过原因')
+        }
+        this.checkHandle('2')
+          this.disabledBtn = true
+      },
+      // 审核提交方法
+      checkHandle: function (type) {
+        const params = {
+          id: this.dataForm.id,
+          state: type,
+          homeId: this.dataForm.homeId,
+          lessorRelation: this.dataForm.lessorRelation,
+          reason: this.checkReason
+        }
+        this.$http.post('/pli/power/rentContractInfo/review', params).then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg)
+          }
+          // 调用文件下发权限接口
+          this.fileJurisdiction(params)
+        }).catch(() => {})
+      },
+      // 文件下发权限接口
+      fileJurisdiction (params) {
+          this.$http.post('/pli/power/rentContractInfo/send', params).then(({ data: res }) => {
+              if (res.code !== 0) {
+                  return this.$message.error(res.msg)
+              }
+              this.$message({
+                  message: this.$t('prompt.success'),
+                  type: 'success',
+                  duration: 500,
+                  onClose: () => {
+                      this.disabledBtn = false
+                      this.checkVisible = false
+                      this.visible = false
+                      this.$emit('refreshDataList')
+                  }
+              })
+          }).catch(() => {})
+      },
+    // 表单提交
+    dataFormSubmitHandle: debounce(function () {
+      this.$refs['dataForm'].validate((valid) => {
+        if (!valid) {
+          return false
+        }
+        this.$http[!this.dataForm.id ? 'post' : 'put']('/pli/power/rentContractInfo/', this.dataForm).then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg)
+          }
+          this.$message({
+            message: this.$t('prompt.success'),
+            type: 'success',
+            duration: 500,
+            onClose: () => {
+              this.visible = false
+              this.$emit('refreshDataList')
+            }
+          })
+        }).catch(() => {})
+      })
+    }, 1000, { 'leading': true, 'trailing': false })
+  }
+}
+</script>
+<style lang="scss" scoped>
+    .resi-btns {
+        margin-top: 20px;
+        text-align: center;
+    }
+</style>
+<style lang="scss">
+.rent {
+  .el-form--inline .el-form-item__content {
+    width: 280px;
+  }
+}
+</style>
diff --git a/src/views/modules/plugins/rent/rentcontractreview.vue b/src/views/modules/plugins/rent/rentcontractreview.vue
index c003e5a8..ae7c5eef 100644
--- a/src/views/modules/plugins/rent/rentcontractreview.vue
+++ b/src/views/modules/plugins/rent/rentcontractreview.vue
@@ -139,11 +139,19 @@
           <el-button type="primary" size="small" @click="getDataList()">{{ $t('query') }}</el-button>
         </el-form-item>
         <el-form-item>
-          <el-button v-if="false" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
+          <el-button v-if="false" type="primary" @click="lookOrCheckHandle()">{{ $t('add') }}</el-button>
         </el-form-item>
       </el-form>
       </el-card>
       <el-card class="resi-card-table">
+      <div style="margin-bottom: 13px;">
+        <el-button
+          class="diy-button--add"
+          size="small"
+          @click="addOrUpdateHandle()"
+          >新增</el-button
+        >
+      </div>
       <el-table class="resi-table" v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%">
         <el-table-column label="序号" header-align="center" align="center" width="50px">
           <template slot-scope="scope">
@@ -172,8 +180,9 @@
         <el-table-column prop="isBlack" label="是否黑名单人员" header-align="center" align="center"></el-table-column>
         <el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
           <template slot-scope="scope">
-            <el-button v-if="scope.row.state === '0'" type="text" size="small" @click="addOrUpdateHandle(scope.row.id,'2')">登记</el-button>
-            <el-button v-else type="text" size="small" @click="addOrUpdateHandle(scope.row.id,'1')">{{ $t('lookBtn') }}</el-button>
+            <el-button v-if="scope.row.state === '0'" type="text" size="small" @click="lookOrCheckHandle(scope.row.id,'2')">登记</el-button>
+            <el-button v-else type="text" size="small" @click="lookOrCheckHandle(scope.row.id,'1')">{{ $t('lookBtn') }}</el-button>
+            <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id, 'edit')">修改</el-button>
 <!--            <el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>-->
           </template>
         </el-table-column>
@@ -189,13 +198,15 @@
       </el-pagination>
       </el-card>
       <!-- 弹窗, 新增 / 修改 -->
-      <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
+      <look-or-check v-if="lookOrCheckVisible" ref="LookOrCheck" @refreshDataList="getDataList"></look-or-check>
+      <add-or-update v-if="addOrUpdateVisible" ref="AddOrUpdate" @refreshDataList="getDataList"></add-or-update>
     </div>
   </el-card>
 </template>
 
 <script>
 import mixinViewModule from '@/mixins/view-module'
+import LookOrCheck from './rentcontractinfo-look-or-check'
 import AddOrUpdate from './rentcontractinfo-add-or-update'
 export default {
   mixins: [mixinViewModule],
@@ -246,10 +257,13 @@ export default {
                     return time.getTime() < new Date(EndDateVal + ' 00:00:00').getTime()
                 }
             }
-        }
+        },
+        lookOrCheckVisible: false,
+        addOrUpdateVisible: false
     }
   },
   components: {
+    LookOrCheck,
     AddOrUpdate
   },
   created () {
@@ -268,13 +282,22 @@ export default {
     }
   },
   methods: {
+      // 查看 / 审核
+      lookOrCheckHandle (id,flag) {
+          this.lookOrCheckVisible = true
+          this.$nextTick(() => {
+              this.$refs.LookOrCheck.dataForm.id = id
+              this.$refs.LookOrCheck.dataForm.flag = flag
+              this.$refs.LookOrCheck.init()
+          })
+      },
       // 新增 / 修改
       addOrUpdateHandle (id,flag) {
           this.addOrUpdateVisible = true
           this.$nextTick(() => {
-              this.$refs.addOrUpdate.dataForm.id = id
-              this.$refs.addOrUpdate.dataForm.flag = flag
-              this.$refs.addOrUpdate.init()
+              this.$refs.AddOrUpdate.dataForm.id = id
+              this.$refs.AddOrUpdate.dataForm.flag = flag
+              this.$refs.AddOrUpdate.init()
           })
       },
       btKeyUpLesseeIdCard (e) {
diff --git a/src/views/modules/plugins/rent/upload-image.vue b/src/views/modules/plugins/rent/upload-image.vue
new file mode 100644
index 00000000..93bbc161
--- /dev/null
+++ b/src/views/modules/plugins/rent/upload-image.vue
@@ -0,0 +1,130 @@
+<template>
+    <div class="upload-image">
+        <el-upload list-type="picture-card"
+            :action="uploadUrl"
+            :data="{ customerId: customerId }"
+            :file-list="fileList"
+            :limit="limit"
+            :on-success="(res, file) => handleImgSuccess(res, file)"
+            :on-error="(res, file) => handleImgError(res, file)"
+            :on-remove="(res) => handleImgRemove(res)"
+            :on-exceed="(res) => handleImgExceed(res)"
+            :before-upload="(file) => beforeImgUpload(file)">
+            <i slot="default" class="el-icon-plus"></i>
+            <div slot="file" slot-scope="{file}">
+                <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
+                <span class="el-upload-list__item-actions">
+                    <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
+                        <i class="el-icon-zoom-in"></i>
+                    </span>
+                    <span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
+                        <i class="el-icon-delete"></i>
+                    </span>
+                </span>
+            </div>
+        </el-upload>
+        <el-dialog :visible.sync="dialogVisible">
+            <img width="100%" :src="dialogImageUrl" alt="">
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+export default {
+    props: {
+        limit: {
+            type: Number,
+            default: 3
+        },
+        rowIndex: {
+            type: Number,
+            default: 0
+        },
+        defaultFileList: {
+            type: Array
+        }
+    },
+    watch: {
+        defaultFileList: {
+            handler (newVal) {
+                newVal.forEach(item => {
+                    item.url = item.fileUrl
+                })
+                this.fileList = newVal
+            },
+            deep: true,
+            immediate: true          
+        }
+
+    },
+    data () {
+        return {
+            dialogImageUrl: '',
+            dialogVisible: false,
+            disabled: false,
+            uploadUrl: `${window.SITE_CONFIG['apiURL']}/oss/file/uploadqrcodeV2`,
+            customerId: localStorage.getItem("customerId"),
+            fileList: [],
+            imageUrls: []
+        }
+    },
+    created() {
+        console.log('xxxxxx', this.rowIndex)
+    },
+    methods: {
+        handleRemove(file) {
+            const delFile = file.url
+            this.fileList.forEach((item, key) => {
+                if (delFile == item.url) {
+                    this.fileList.splice(key, 1)
+                }
+            })
+        },
+        handlePictureCardPreview(file) {
+            this.dialogImageUrl = file.url
+            this.dialogVisible = true
+        },
+        beforeImgUpload(file) {
+            // console.log(file)
+        },
+        handleImgExceed(res) {
+            console.log(res)
+            this.$message({
+              type: "warning",
+              message: `文件数量最多不超过${this.limit}个`,
+            })
+        },
+        handleImgRemove(file) {
+            console.log("handleImgRemove", file)
+        },
+        handleImgSuccess(res, file) {
+            // console.log("handleImgSuccess", res, file)
+            if (res.code === 0 && res.msg === "success") {
+                this.fileList.push(file)
+                this.$emit('change', this.fileList, this.rowIndex)
+            } else {
+                this.$message.error(res.msg)
+            }
+        },
+
+        handleImgError(res, file) {
+            console.log(res)
+        },
+    }
+}
+</script>
+<style lang="scss" scoped>
+.upload-image {
+    // min-width: 120px;
+    // height: 80px;
+}
+/deep/ .el-upload--picture-card {
+    width: 60px;
+    height: 60px;
+    line-height: 70px;
+}
+/deep/ .el-upload-list--picture-card .el-upload-list__item {
+    width: 60px;
+    height: 60px;
+}
+</style>