diff --git a/src/api/onlineHome/homestead/application.js b/src/api/onlineHome/homestead/application.js
index 02de3109..9d5a35e4 100644
--- a/src/api/onlineHome/homestead/application.js
+++ b/src/api/onlineHome/homestead/application.js
@@ -61,6 +61,24 @@ export function saveHouseBaseInfoThenSubmit(data){
   })
 }
 
+//同意审批
+export function agreeApply(data){
+  return request({
+    url:'/house/mobile/agreeApply',
+    method:'post',
+    data:data
+  })
+}
+
+//驳回审批
+export function rejectApply(data){
+  return request({
+    url:'/house/mobile/rejectApply',
+    method:'post',
+    data:data
+  })
+}
+
 //上传图片
 export function attach(data){
   console.log(data)
diff --git a/src/api/onlineHome/homestead/paidUtilize.js b/src/api/onlineHome/homestead/paidUtilize.js
new file mode 100644
index 00000000..56a9f685
--- /dev/null
+++ b/src/api/onlineHome/homestead/paidUtilize.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+//查询列表
+export function getList(data){
+  return request({
+    url:'/house/mobile/ycsy/list',
+    method:'get',
+    params:data
+  })
+}
+
+//删除列表项
+export function removeList(id){
+  return request({
+    url:'/house/ycsy/remove/'+id,
+    method:'get'
+  })
+}
+
+//详情
+export function getYcsy(id){
+  return request({
+    url:'/house/ycsy/get/'+id,
+    method:'get'
+  })
+}
+
+//提交
+export function submitApply(id){
+  return request({
+    url:'/house/ycsy/submitApply/'+id,
+    method:'post'
+  })
+}
+
+//修改
+export function ycsyEdit(data){
+  return request({
+    url:'/house/ycsy/edit',
+    method:'post',
+    data:data
+  })
+}
+
+//新增
+export function ycsyAdd(data){
+  return request({
+    url:'/house/ycsy/add',
+    method:'post',
+    data:data
+  })
+}
+
+//使用权人查询
+export function listByDeptId(){
+  return request({
+    url:'house/obligee/listByDeptId',
+    method:'get',
+  })
+}
diff --git a/src/router/index.js b/src/router/index.js
index 81cbbd00..3e999269 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -852,6 +852,42 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/onlineHome/homestead/paidExit/paidExitModify'], resolve)
   },
+  {
+    path: '/paidUtilizeList',
+    name: 'paidUtilizeList',
+    meta: {
+      title: '有偿利用',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/paidUtilize/paidUtilizeList'], resolve)
+  },
+  {
+    path: '/paidUtilizeModify',
+    name: 'paidUtilizeModify',
+    meta: {
+      title: '修改有偿利用',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/paidUtilize/paidUtilizeModify'], resolve)
+  },
+  {
+    path: '/paidUtilizeDteail',
+    name: 'paidUtilizeDteail',
+    meta: {
+      title: '查看有偿利用',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/paidUtilize/paidUtilizeDteail'], resolve)
+  },
+  {
+    path: '/paidUtilizeAdd',
+    name: 'paidUtilizeAdd',
+    meta: {
+      title: '添加有偿利用',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/paidUtilize/paidUtilizeAdd'], resolve)
+  },
   {
     path: '/task',
     name: 'task',
diff --git a/src/views/onlineHome/done.vue b/src/views/onlineHome/done.vue
index 02fc297a..c9cf88f2 100644
--- a/src/views/onlineHome/done.vue
+++ b/src/views/onlineHome/done.vue
@@ -127,7 +127,7 @@
             case 'baseApply':
             case 'landscope':
             case 'accepting':
-              this.$router.push({name:'approvalForm',query: {id:item.formData.id}})
+              this.$router.push({name:'approvalForm',query: {id:item.formData.id,taskId:item.taskId,instanceId:item.formData.instanceId,type:item.type}})
               break;
             case 'yinnong_transfer':
               this.$router.push({name:'approvalApproval',query: {id:item.formData.id,taskId:item.taskId,type:item.type}})
diff --git a/src/views/onlineHome/homestead/homeApplication/applicationForm.vue b/src/views/onlineHome/homestead/homeApplication/applicationForm.vue
index 6cd9ef2e..fb2caebe 100644
--- a/src/views/onlineHome/homestead/homeApplication/applicationForm.vue
+++ b/src/views/onlineHome/homestead/homeApplication/applicationForm.vue
@@ -393,122 +393,6 @@
 
         </van-form>
 
-      <!--        审核流程开始-->
-        <div class="main_box examine_box">
-          <van-row type="flex" justify="space-between" align="center">
-            <van-col span="5">审核<br/>意见</van-col>
-            <van-col span="19">
-              <van-radio-group v-model="radio" direction="horizontal">
-                <van-radio name="1">同意</van-radio>
-                <van-radio name="2">驳回</van-radio>
-              </van-radio-group>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="同意申请宅基地"/>
-            </van-col>
-          </van-row>
-        </div>
-
-        <div class="main_box examine_box">
-          <van-row type="flex" justify="space-between" align="center">
-            <van-col span="5">农业<br/>农村<br/>部门<br/>审查<br/>意见</van-col>
-            <van-col span="19">
-              <van-cell-group>
-                <van-cell title="成员资格审查">
-                  <template #right-icon>
-                    <van-radio-group v-model="radio" direction="horizontal" style="padding: 0; border: 0;">
-                      <van-radio name="1">通过</van-radio>
-                      <van-radio name="2">不通过</van-radio>
-                    </van-radio-group>
-                  </template>
-                </van-cell>
-                <van-cell title="一户一宅情况">
-                  <template #right-icon>
-                    <van-radio-group v-model="radio" direction="horizontal" style="padding: 0; border: 0;">
-                      <van-radio name="1">符合</van-radio>
-                      <van-radio name="2">不符合</van-radio>
-                    </van-radio-group>
-                  </template>
-                </van-cell>
-                <van-cell title="村委会审查资料">
-                  <template #right-icon>
-                    <van-radio-group v-model="radio" direction="horizontal" style="padding: 0; border: 0;">
-                      <van-radio name="1">齐全</van-radio>
-                      <van-radio name="2">不齐全</van-radio>
-                    </van-radio-group>
-                  </template>
-                </van-cell>
-              </van-cell-group>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="审查意见"/>
-            </van-col>
-          </van-row>
-        </div>
-
-        <div class="main_box examine_box">
-          <van-row type="flex" justify="space-between" align="center">
-            <van-col span="5">自然<br/>资源<br/>部门<br/>意见</van-col>
-            <van-col span="19">
-              <van-field v-model="value" label="用地面积" placeholder="请输入" input-align="right">
-                <template #right-icon>
-                  ㎡
-                </template>
-              </van-field>
-              <van-field v-model="value" label="土地权属" placeholder="请选择" readonly input-align="right" is-link arrow-direction="down"/>
-              <van-field v-model="value" label="东至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="南至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="西至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="北至" placeholder="请输入" input-align="right"/>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="审查意见"/>
-            </van-col>
-          </van-row>
-        </div>
-
-        <div class="main_box examine_box">
-          <van-row type="flex" justify="space-between" align="center">
-            <van-col span="5">农业<br/>农村<br/>部门<br/>审查<br/>意见</van-col>
-            <van-col span="19">
-              <van-field v-model="value" label="建筑类型" placeholder="请选择" readonly input-align="right" is-link arrow-direction="down"/>
-              <van-field v-model="value" label="图纸类型" placeholder="请选择" readonly input-align="right" is-link arrow-direction="down"/>
-
-              <van-field v-model="value" label="建筑占地面积" placeholder="请输入" input-align="right">
-                <template #right-icon>
-                  ㎡
-                </template>
-              </van-field>
-
-              <van-field v-model="value" label="建筑面积" placeholder="请输入" input-align="right">
-                <template #right-icon>
-                  ㎡
-                </template>
-              </van-field>
-
-              <van-field v-model="value" label="建筑层数" placeholder="请输入" input-align="right">
-                <template #right-icon>
-                  层
-                </template>
-              </van-field>
-
-              <van-field v-model="value" label="建筑高度" placeholder="请输入" input-align="right">
-                <template #right-icon>
-                  m
-                </template>
-              </van-field>
-              <van-field v-model="value" label="东至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="南至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="西至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="北至" placeholder="请输入" input-align="right"/>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="审批意见"/>
-            </van-col>
-          </van-row>
-        </div>
-
-        <div class="main_box examine_box">
-          <van-row type="flex" justify="space-between" align="center">
-            <van-col span="5">上传<br/>附件</van-col>
-            <van-col span="19">
-              <van-uploader v-model="fileList" multiple style="margin-bottom: 0;" />
-            </van-col>
-          </van-row>
-        </div>
-      <!--        审核流程结束-->
       </div>
 
     </div>
diff --git a/src/views/onlineHome/homestead/homeApproval/approvalForm.vue b/src/views/onlineHome/homestead/homeApproval/approvalForm.vue
index 1ff239d2..26234aa5 100644
--- a/src/views/onlineHome/homestead/homeApproval/approvalForm.vue
+++ b/src/views/onlineHome/homestead/homeApproval/approvalForm.vue
@@ -7,6 +7,9 @@
         placeholder
         @click-left="$router.back(-1)"
       >
+        <template #right>
+          <van-icon name="../../../static/images/icon/icon_flow.png" size="20" @click="goFlow"/>
+        </template>
       </van-nav-bar>
       <van-steps :active="active" active-color="#38f">
         <van-step>申请</van-step>
@@ -229,51 +232,35 @@
         </van-form>
 
       <!--        审核流程开始-->
-        <div class="main_box examine_box" v-if="">
-          <van-row type="flex" justify="space-between" align="center">
-            <van-col span="5">审核<br/>意见</van-col>
-            <van-col span="19">
-              <van-radio-group v-model="radio" direction="horizontal">
-                <van-radio name="1">同意</van-radio>
-                <van-radio name="2">驳回</van-radio>
-              </van-radio-group>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="同意申请宅基地"/>
-            </van-col>
-          </van-row>
-        </div>
-        <div class="main_box examine_box" v-if="applicationDetail.needVillageAudit">
+<!--        <div class="main_box examine_box" v-if="">-->
+<!--          <van-row type="flex" justify="space-between" align="center">-->
+<!--            <van-col span="5">审核<br/>意见</van-col>-->
+<!--            <van-col span="19">-->
+<!--              <van-radio-group v-model="radio" direction="horizontal">-->
+<!--                <van-radio name="1">同意</van-radio>-->
+<!--                <van-radio name="2">驳回</van-radio>-->
+<!--              </van-radio-group>-->
+<!--              <van-field rows="2" autosize readonly type="textarea" placeholder="同意申请宅基地"/>-->
+<!--            </van-col>-->
+<!--          </van-row>-->
+<!--        </div>-->
+        <div class="main_box examine_box" v-if="applicationDetail.needVillageShow&&this.$route.query.type != 'done'">
           <van-row type="flex" justify="space-between" align="center">
             <van-col span="5">村级<br/>审核<br/>意见</van-col>
             <van-col span="19">
-              <van-radio-group v-model="radio" direction="horizontal">
-                <van-radio name="1">同意</van-radio>
-                <van-radio name="2">驳回</van-radio>
-              </van-radio-group>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="同意申请宅基地"/>
-            </van-col>
-          </van-row>
-        </div>
-        <div class="main_box examine_box" v-if="applicationDetail.needTownAudit">
-          <van-row type="flex" justify="space-between" align="center">
-            <van-col span="5">镇级<br/>审核<br/>意见</van-col>
-            <van-col span="19">
-              <van-radio-group v-model="radio" direction="horizontal">
-                <van-radio name="1">同意</van-radio>
-                <van-radio name="2">驳回</van-radio>
-              </van-radio-group>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="同意申请宅基地"/>
+              <van-field :readonly="!applicationDetail.needVillageAudit" v-model="applicationDetail.tHouseApproveVillageOptions.villageOption" rows="2" autosize readonly type="textarea" placeholder="同意申请宅基地"/>
             </van-col>
           </van-row>
         </div>
 
-        <div class="main_box examine_box" v-if="applicationDetail.needAgricultureAudit">
+        <div class="main_box examine_box" v-if="applicationDetail.needAgricultureShow&&this.$route.query.type != 'done'">
           <van-row type="flex" justify="space-between" align="center">
             <van-col span="5">农业<br/>农村<br/>部门<br/>审查<br/>意见</van-col>
             <van-col span="19">
               <van-cell-group>
                 <van-cell title="成员资格审查">
                   <template #right-icon>
-                    <van-radio-group v-model="radio" direction="horizontal" style="padding: 0; border: 0;">
+                    <van-radio-group :disabled="!applicationDetail.needAgricultureAudit" v-model="applicationDetail.tHouseApproveAgricultureOptions.isMembership" direction="horizontal" style="padding: 0; border: 0;">
                       <van-radio name="1">通过</van-radio>
                       <van-radio name="2">不通过</van-radio>
                     </van-radio-group>
@@ -281,7 +268,7 @@
                 </van-cell>
                 <van-cell title="一户一宅情况">
                   <template #right-icon>
-                    <van-radio-group v-model="radio" direction="horizontal" style="padding: 0; border: 0;">
+                    <van-radio-group :disabled="!applicationDetail.needAgricultureAudit" v-model="applicationDetail.tHouseApproveAgricultureOptions.isOnehouse" direction="horizontal" style="padding: 0; border: 0;">
                       <van-radio name="1">符合</van-radio>
                       <van-radio name="2">不符合</van-radio>
                     </van-radio-group>
@@ -289,67 +276,148 @@
                 </van-cell>
                 <van-cell title="村委会审查资料">
                   <template #right-icon>
-                    <van-radio-group v-model="radio" direction="horizontal" style="padding: 0; border: 0;">
+                    <van-radio-group :disabled="!applicationDetail.needAgricultureAudit" v-model="applicationDetail.tHouseApproveAgricultureOptions.isReviewmaterials" direction="horizontal" style="padding: 0; border: 0;">
                       <van-radio name="1">齐全</van-radio>
                       <van-radio name="2">不齐全</van-radio>
                     </van-radio-group>
                   </template>
                 </van-cell>
               </van-cell-group>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="审查意见"/>
+              <van-field :readonly="!applicationDetail.needAgricultureAudit" rows="2" v-model="applicationDetail.tHouseApproveAgricultureOptions.approveOption" autosize readonly type="textarea" placeholder="审查意见"/>
             </van-col>
           </van-row>
         </div>
 
-        <div class="main_box examine_box" v-if="applicationDetail.needNatureAudit">
+        <div class="main_box examine_box" v-if="applicationDetail.needNatureShow&&this.$route.query.type != 'done'">
           <van-row type="flex" justify="space-between" align="center">
             <van-col span="5">自然<br/>资源<br/>部门<br/>意见</van-col>
             <van-col span="19">
-              <van-field v-model="value" label="用地面积" placeholder="请输入" input-align="right"><template #right-icon>㎡</template></van-field>
-              <van-field v-model="value" label="土地权属" placeholder="请选择" readonly input-align="right" is-link arrow-direction="down"/>
-              <van-field v-model="value" label="东至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="南至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="西至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="北至" placeholder="请输入" input-align="right"/>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="审查意见"/>
+              <van-field :readonly="!applicationDetail.needNatureAudit" v-model="applicationDetail.tHouseApproveNatureOptions.landArea" label="用地面积" placeholder="请输入" input-align="right"><template #right-icon>㎡</template></van-field>
+              <van-field
+                v-model="rightsTypeValue"
+                label="土地权属"
+                placeholder="请选择"
+                input-align="right"
+                is-link
+                readonly
+                arrow-direction="down"
+                @click="showRightsType = true"
+              />
+              <van-popup v-model="showRightsType" position="bottom">
+                <van-picker
+                  show-toolbar
+                  :columns="rightsTypeDesignPaper"
+                  @confirm="onConfirmRightsType"
+                  @cancel="showRightsType = false"
+                  :readonly="!applicationDetail.needNatureAudit"
+                />
+              </van-popup>
+              <van-field :readonly="!applicationDetail.needNatureAudit" v-model="applicationDetail.tHouseApproveNatureOptions.east" label="东至" placeholder="请输入" input-align="right"/>
+              <van-field :readonly="!applicationDetail.needNatureAudit" v-model="applicationDetail.tHouseApproveNatureOptions.south" label="南至" placeholder="请输入" input-align="right"/>
+              <van-field :readonly="!applicationDetail.needNatureAudit" v-model="applicationDetail.tHouseApproveNatureOptions.west" label="西至" placeholder="请输入" input-align="right"/>
+              <van-field :readonly="!applicationDetail.needNatureAudit" v-model="applicationDetail.tHouseApproveNatureOptions.north" label="北至" placeholder="请输入" input-align="right"/>
+              <div class="mapBox">
+                <div id="mapWrap1" style="height: 150px;"></div>
+                <div class="mapBox_button" v-if="applicationDetail.needNatureAudit">
+                  <van-button id="drawPolygon1" native-type="button" icon="../../../static/images/icon/icon_ht.png" type="default" block round size="small"></van-button>
+                  <van-button id="drawRemove1" native-type="button" icon="cross" type="default" block round size="small" style="margin-top: 0.2rem"></van-button>
+                </div>
+              </div>
+              <van-field :readonly="!applicationDetail.needNatureAudit" v-model="applicationDetail.tHouseApproveNatureOptions.approveOption" rows="2" autosize type="textarea" placeholder="审查意见"/>
             </van-col>
           </van-row>
         </div>
 
-        <div class="main_box examine_box" v-if="applicationDetail.needAgricultureShow">
+        <div class="main_box examine_box" v-if="applicationDetail.needBuildingShow&&this.$route.query.type != 'done'">
           <van-row type="flex" justify="space-between" align="center">
             <van-col span="5">其他<br/>部门<br/>意见<br/>(住宅<br/>部门)</van-col>
             <van-col span="19">
-              <van-field v-model="value" label="建筑类型" placeholder="请选择" readonly input-align="right" is-link arrow-direction="down"/>
-              <van-field v-model="value" label="图纸类型" placeholder="请选择" readonly input-align="right" is-link arrow-direction="down"/>
-              <van-field v-model="value" label="建筑占地面积" placeholder="请输入" input-align="right"><template #right-icon>㎡</template></van-field>
-              <van-field v-model="value" label="建筑面积" placeholder="请输入" input-align="right"><template #right-icon>㎡</template></van-field>
-              <van-field v-model="value" label="建筑层数" placeholder="请输入" input-align="right"><template #right-icon>层</template></van-field>
-              <van-field v-model="value" label="建筑高度" placeholder="请输入" input-align="right"><template #right-icon>m</template></van-field>
-              <van-field v-model="value" label="东至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="南至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="西至" placeholder="请输入" input-align="right"/>
-              <van-field v-model="value" label="北至" placeholder="请输入" input-align="right"/>
-              <van-field rows="2" autosize readonly type="textarea" placeholder="审批意见"/>
+              <van-field
+                v-model="tHouseBuildingTypeValue"
+                label="建筑类型"
+                placeholder="请选择"
+                input-align="right"
+                is-link
+                readonly
+                arrow-direction="down"
+                @click="applicationDetail.needBuildingAudit == false ? '' : showBuildingType = true"
+              />
+              <van-popup v-model="showBuildingType" position="bottom">
+                <van-picker
+                  show-toolbar
+                  :columns="buildingTypeDesignPaper"
+                  @confirm="onConfirmBuildingType"
+                  @cancel="showBuildingType = false"
+                />
+              </van-popup>
+              <van-field
+                v-model="tHouseDesignPaper"
+                label="图纸类型"
+                placeholder="请选择"
+                input-align="right"
+                is-link
+                readonly
+                arrow-direction="down"
+                @click="applicationDetail.needBuildingAudit == false ? '' : showDesignPaper = true"
+              />
+              <van-popup v-model="showDesignPaper" position="bottom">
+                <van-picker
+                  show-toolbar
+                  :columns="designPaperOption"
+                  @confirm="onConfirmDesignPaper"
+                  @cancel="showDesignPaper = false"
+                />
+              </van-popup>
+
+              <van-field :readonly="!applicationDetail.needBuildingAudit" v-model="applicationDetail.tHouseApproveOtherOptions.buildingLandArea" label="建筑占地面积" placeholder="请输入" input-align="right"><template #right-icon>㎡</template></van-field>
+              <van-field :readonly="!applicationDetail.needBuildingAudit" v-model="applicationDetail.tHouseApproveOtherOptions.buildingArea" label="建筑面积" placeholder="请输入" input-align="right"><template #right-icon>㎡</template></van-field>
+              <van-field :readonly="!applicationDetail.needBuildingAudit" v-model="applicationDetail.tHouseApproveOtherOptions.buildingFloors" label="建筑层数" placeholder="请输入" input-align="right"><template #right-icon>层</template></van-field>
+              <van-field :readonly="!applicationDetail.needBuildingAudit" v-model="applicationDetail.tHouseApproveOtherOptions.buildingHight" label="建筑高度" placeholder="请输入" input-align="right"><template #right-icon>m</template></van-field>
+              <van-field :readonly="!applicationDetail.needBuildingAudit" v-model="applicationDetail.tHouseApproveOtherOptions.east" label="东至" placeholder="请输入" input-align="right"/>
+              <van-field :readonly="!applicationDetail.needBuildingAudit" v-model="applicationDetail.tHouseApproveOtherOptions.south" label="南至" placeholder="请输入" input-align="right"/>
+              <van-field :readonly="!applicationDetail.needBuildingAudit" v-model="applicationDetail.tHouseApproveOtherOptions.west" label="西至" placeholder="请输入" input-align="right"/>
+              <van-field :readonly="!applicationDetail.needBuildingAudit" v-model="applicationDetail.tHouseApproveOtherOptions.north" label="北至" placeholder="请输入" input-align="right"/>
+              <van-field :readonly="!applicationDetail.needBuildingAudit" v-model="applicationDetail.tHouseApproveOtherOptions.approveOption" rows="2" autosize  type="textarea" placeholder="审批意见"/>
+            </van-col>
+          </van-row>
+        </div>
+
+        <div class="main_box examine_box" v-if="applicationDetail.needTownShow&&this.$route.query.type != 'done'">
+          <van-row type="flex" justify="space-between" align="center">
+            <van-col span="5">镇级<br/>审核<br/>意见</van-col>
+            <van-col span="19">
+              <van-field :readonly="!applicationDetail.needTownAudit" v-model="applicationDetail.tHouseApproveTownOptions.approveOption" rows="2" autosize type="textarea" placeholder="同意申请宅基地"/>
             </van-col>
           </van-row>
         </div>
 
-        <div class="main_box examine_box">
+        <div class="main_box examine_box" v-if="item.findList&&this.$route.query.type != 'done'" v-for="(item , index) in fileArray" :key="index">
           <van-row type="flex" justify="space-between" align="center">
-            <van-col span="5">上传<br/>附件</van-col>
+            <van-col span="5">{{item.fileTypeName}}</van-col>
             <van-col span="19">
-              <van-uploader v-model="fileList" multiple style="margin-bottom: 0;" />
+              <van-uploader v-model="item.findList" multiple style="margin-bottom: 0;" />
             </van-col>
           </van-row>
         </div>
+
+        <div style="margin: 16px;" v-if="this.$route.query.type != 'done'">
+          <van-row>
+            <van-col span="12" align="center">
+              <van-button type="info" native-type="submit" class="submitButton" @click="onSubmit('agree')">同意</van-button>
+            </van-col>
+            <van-col span="12" align="center">
+              <van-button type="danger" native-type="submit" class="submitButton" @click="onSubmit('reject')">驳回</van-button>
+            </van-col>
+          </van-row>
+          <div class="clear"></div>
+        </div>
       <!--        审核流程结束-->
       </div>
     </div>
 </template>
 
 <script>
-  import { allInformation , treeSingleProcessView , attachmentFind , saveHouseBaseInfo , houseList , attach , removeFile , saveHouseBaseInfoThenSubmit} from "@/api/onlineHome/homestead/application";
+  import { allInformation , treeSingleProcessView , attachmentFind , saveHouseBaseInfo , houseList , attach , removeFile , saveHouseBaseInfoThenSubmit , agreeApply , rejectApply} from "@/api/onlineHome/homestead/application";
   import $ from "jquery";
   export default {
   name: "applicationForm",
@@ -363,6 +431,7 @@
       value: '',
       columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
       showPicker: false,
+      showRightsType: false,
       showBuildingType: false,
       showLandIsposal: false,
       showHousingStructure: false,
@@ -372,6 +441,7 @@
       showHouseType:false,
       showHouse:false,
       showSex:false,
+      showDesignPaper:false,
       id:'',
       applicationDetail:[],
       //建房类型字典
@@ -382,6 +452,10 @@
       landIsposal:[],
       //房屋构造字典
       housingStructure:[],
+      rightsTypeDesignPaper:[],
+      buildingTypeDesignPaper:[],
+      designPaperOption:[],
+      designPaper:[],
       //户型
       houseType:[],
       //请求参数
@@ -405,6 +479,9 @@
       buildingTypeValue:'',//当前显示建房类型
       landIsposalValue:'',//当前显示处置情况
       houseTypeValue:'',//当前显示户型
+      rightsTypeValue:'',
+      tHouseBuildingTypeValue:'',
+      tHouseDesignPaper:'',
       sexValue:'',//当前显示性别
       CurrentSituation:false,
     };
@@ -415,6 +492,9 @@
     this.getDetail();
   },
   methods: {
+    goFlow(){
+      window.location='flowChart?id='+this.id;
+    },
     //获取数据集合
     getDetail(){
       allInformation(this.id).then(response => {
@@ -429,8 +509,10 @@
         this.houseGetDicts("building_type").then((res) => {
           res.data.map(item => {
             this.buildingType.push({ value:item.dictValue, text: item.dictLabel});
+            this.buildingTypeDesignPaper.push({ value:item.dictValue, text: item.dictLabel});
           });
           this.buildingTypeValue = this.selectDictLabel(res.data, response.data.tHouseApplyProposedSituation.buildingType);
+          this.tHouseBuildingTypeValue = this.selectDictLabel(res.data, response.data.tHouseApplyProposedSituation.buildingType);
         });
         //房屋构造字典查询
         this.houseGetDicts("housing_structure").then((res) => {
@@ -439,6 +521,20 @@
           });
           this.housingStructureValue = this.selectDictLabel(res.data, response.data.tHouseApplyProposedSituation.housingStructure);
         });
+        //房屋构造字典查询
+        this.houseGetDicts("rights_type").then((res) => {
+          res.data.map(item => {
+            this.rightsTypeDesignPaper.push({ value:item.dictValue, text: item.dictLabel});
+          });
+          this.rightsTypeValue = this.selectDictLabel(res.data, response.data.tHouseApproveNatureOptions.rightsType);
+        });
+        //图纸类型字典查询
+        this.houseGetDicts("design_paper").then((res) => {
+          res.data.map(item => {
+            this.designPaperOption.push({ value:item.dictValue, text: item.dictLabel});
+          });
+          this.tHouseDesignPaper = this.selectDictLabel(res.data, response.data.tHouseApproveOtherOptions.designPaper);
+        });
         //处置情况字典查询
         if(response.data.tHouseApplyProposer.existHomestead == 'Y'){
           this.CurrentSituation = true ;
@@ -463,6 +559,104 @@
             this.showHouse = true;
           }
         });
+        //村级意见需要显示
+        if (response.data.tHouseApproveVillageOptions == null){
+          //村级审批意见
+          response.data.tHouseApproveVillageOptions = {
+            applyProposerId: this.id,
+            groupLeader: null,
+            groupOption: null,
+            groupTime: null,
+            villageLeader: "",
+            //审批意见
+            villageOption: "",
+            villageTime: ""
+          }
+        }
+        //自然资源部门意见需要显示
+        if (response.data.tHouseApproveNatureOptions== null){
+          //自然资源部门审批
+          response.data.tHouseApproveNatureOptions = {
+            applyProposerId: this.id,
+            //用地面积
+            landArea: '',
+            //土地权属 字典 rights_type
+            rightsType: "",
+            //东至
+            east: "",
+            //西至
+            west: "",
+            //南至
+            south: "",
+            //北至
+            north: "",
+            //审批意见
+            approveOption: "",
+            approveTime: "",
+            theGeom: "",
+            theGeomRaw: "",
+            valid: true
+          }
+        }
+        //住建部门意见需要显示
+        if (response.data.tHouseApproveOtherOptions == null){
+          //其他部门审批意见
+          response.data.tHouseApproveOtherOptions = {
+            applyProposerId: this.id,
+            //建筑类型 字典 building_type
+            buildingType: "",
+            //建筑面积
+            buildingArea: '',
+            //建筑层数
+            buildingFloors: '',
+            //建筑高度
+            buildingHight: '',
+            //建筑占地面积
+            buildingLandArea: '',
+            //图纸类型 字典  design_paper
+            designPaper: "",
+            //东至
+            east: "",
+            //西至
+            west: "",
+            //南至
+            south: "",
+            //北至
+            north: "",
+            //审批意见
+            approveOption: "",
+            approveTime: "",
+            valid: true
+          }
+        }
+        //农业农村部门意见需要显示
+        if (response.data.tHouseApproveAgricultureOptions == null){
+          //农业部门审批
+          response.data.tHouseApproveAgricultureOptions = {
+            id: null,
+            applyProposerId: this.id,
+            //成员资格审查 1 通过 2 不通过
+            isMembership: "",
+            //一户一宅情况 1 符合 2 不符合
+            isOnehouse: "",
+            //村委会审查资料 1 齐全 2 不齐全
+            isReviewmaterials: "",
+            approveLeader: "",
+            //农业部门审批意见
+            approveOption: ""
+          }
+        }
+        //乡镇部门意见需要显示
+        if (response.data.tHouseApproveTownOptions == null){
+          //县级审批意见
+          response.data.tHouseApproveTownOptions = {
+            applyProposerId: this.id,
+            approveLeader: "",
+            //审批意见
+            approveOption: "",
+            approveTime: ""
+          }
+        }
         this.applicationDetail = response.data;
         this.parameter.houseApplyStatus = response.data.tHouseApplyProposer.houseApplyStatus;
         let currentProcessKey = response.data.currentProcessKey;
@@ -479,6 +673,7 @@
         }
         //获取上传文件列表
         treeSingleProcessView(this.parameter).then(res => {
+          console.log(res.rows)
           this.fileArray = res.rows
           this.params.tableId = this.id;
           for (let i = 0 ; i < res.rows.length ; i++){
@@ -496,9 +691,25 @@
         var that = this ;
         setTimeout(function(){
           that.pointDarw();
+          that.pointDarw1();
         },2000)
       });
     },
+    onConfirmRightsType(data){
+      this.rightsTypeValue = data.text;
+      this.applicationDetail.tHouseApproveNatureOptions.rightsType = data.value;
+      this.showRightsType = false;
+    },
+    onConfirmBuildingType(data){
+      this.tHouseBuildingTypeValue = data.text;
+      this.applicationDetail.tHouseApproveNatureOptions.buildingType = data.value;
+      this.showBuildingType = false;
+    },
+    onConfirmDesignPaper(data){
+      this.tHouseDesignPaper = data.text;
+      this.applicationDetail.tHouseApproveNatureOptions.designPaper = data.value;
+      this.showDesignPaper = false;
+    },
     base64toFile(dataurl, filename = "file") {
       let arr = dataurl.split(",");
       let mime = arr[0].match(/:(.*?);/)[1];
@@ -541,30 +752,22 @@
           });
         }
       }
-      form.tHouseApplyProposer=this.applicationDetail.tHouseApplyProposer;
-      form.tHouseApplyFamilyMembers=this.applicationDetail.tHouseApplyFamilyMembers;
-      form.tHouseApproveVillageOptions=this.applicationDetail.tHouseApproveVillageOptions;
-      form.tHouseApplyCurrentSituation=this.applicationDetail.tHouseApplyCurrentSituation;
-      form.tHouseApplyProposedSituation=this.applicationDetail.tHouseApplyProposedSituation;
       setTimeout(function(){
-        if (type == 'keep'){
-          saveHouseBaseInfo(form).then(res => {
+        if (type == 'agree'){
+          agreeApply(that.applicationDetail).then(res => {
             if(res.code = 200){
-              that.$toast.success('保存成功');
+              that.$toast.success('同意申请');
             }
           });
         }
-        if (type == 'submit'){
-          saveHouseBaseInfoThenSubmit(form).then(res => {
+        if (type == 'reject'){
+          rejectApply(that.applicationDetail).then(res => {
             if(res.code = 200){
-              that.$toast.success('提交成功');
-              that.getDetail();
+              that.$toast.success('驳回申请');
             }
           });
         }
-
       },1000)
-
     },
     pointDarw() {
       //地图只加载一次
@@ -825,6 +1028,265 @@
         });
       }
     },
+    pointDarw1() {
+      //地图只加载一次
+      this.landOpen = false;
+      //加载地图编辑
+      var that = this;
+      var map;
+      //var hc_land;
+      var draw; // global so we can remove it later
+      var vector_drawing;
+      var minMapZoom;
+      var maxMapZoom;
+      var zoomLook;
+      if (this.formEditor) {
+        zoomLook = 18
+        minMapZoom = 18
+        maxMapZoom = 18
+      } else {
+        zoomLook = 16.9
+        minMapZoom = 16
+        maxMapZoom = 18.9
+      }
+      if (this.applicationDetail.tHouseApproveNatureOptions.theGeom != null && this.applicationDetail.tHouseApproveNatureOptions.theGeom != ""
+        && this.applicationDetail.tHouseApproveNatureOptions.theGeom != undefined) {
+        this.startDarw = true;
+        this.openDarw = false;
+      } else {
+        this.startDarw = false;
+        this.openDarw = true;
+      }
+      if (this.startDarw) {
+        document.getElementById("mapWrap1").innerHTML = '';
+        var hc_land;
+        var draw; // global so we can remove it later
+        var vector_drawing;
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //加载地图
+        map = new ol.Map({
+          // interactions: ol.interaction.DragPan({
+          //   onFocusOnly: false
+          // }),
+          controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+          layers: [aerial, yingxzi],
+          projection: projection,
+          target: "mapWrap1",
+          view: new ol.View({
+            //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+            zoom: zoomLook,
+            minZoom: minMapZoom, //地图缩小限制
+            maxZoom: maxMapZoom, //地图放大限制
+          }),
+        });
+        if (this.formEditor) {
+          let pan = getPan();
+          //false：当前地图不可拖动。true：可拖动
+          pan.setActive(false);
+
+          function getPan() {
+            let pan = '';
+            map.getInteractions().forEach(function (element, index, array) {
+              if (element instanceof ol.interaction.DragPan) {
+                pan = element;
+              }
+            })
+            return pan;
+          }
+        }
+        //图层查询定位开始 ---------start
+        hc_land = new ol.layer.Vector({
+          title: "add Layer",
+          source: new ol.source.Vector({
+            projection: projection,
+            features: new ol.format.GeoJSON().readFeatures("{\n" +
+              "    \"type\": \"Feature\",\n" +
+              "    \"geometry\":" + this.applicationDetail.tHouseApproveNatureOptions.theGeom + "}"),
+          }),
+          style: new ol.style.Style({
+            fill: new ol.style.Fill({
+              //矢量图层填充颜色，以及透明度
+              color: "rgba(204, 255, 204,0.3)",
+            }),
+            stroke: new ol.style.Stroke({
+              //边界样式
+              color: "#47c68f",
+              width: 3,
+            }),
+          }),
+        });
+        map.addLayer(hc_land);
+        var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
+        var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
+        var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
+        var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
+        //定位查询位置
+        var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
+        map.getView().animate({
+          // 只设置需要的属性即可
+          center: center, // 中心点
+          zoom: 17.9, // 缩放级别
+          rotation: undefined, // 缩放完成view视图旋转弧度
+          duration: 1000, // 缩放持续时间，默认不需要设置
+        });
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#drawPolygon1").click(function () {
+          map.removeLayer(hc_land);
+          map.removeLayer(vector_drawing);
+          that.drawInsert = null;
+          map.removeInteraction(draw);
+          var source = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: source,
+          });
+          map.addLayer(vector_drawing);
+          var typeSelect = "Polygon";
+
+          function addInteraction() {
+            var value = typeSelect;
+            draw = new ol.interaction.Draw({
+              source: source,
+              type: typeSelect
+            });
+            draw.on('drawend', function (evt) {
+              console.log(that.drawInsert);
+              if(that.drawInsert != null){
+                $("#drawRemove1").trigger('click');
+              }
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              that.drawInsert = coordinate;
+              map.removeInteraction(draw);
+            });
+            map.addInteraction(draw);
+          }
+          addInteraction();
+        });
+        //清除画图鼠标点击事件
+        $("#drawRemove1").click(function () {
+          that.drawInsert = null;
+          map.addLayer(hc_land);
+          map.removeInteraction(draw);
+          map.removeLayer(vector_drawing);
+        });
+      }
+      if (this.openDarw) {
+        document.getElementById("mapWrap1").innerHTML = '';
+        var projection = new ol.proj.Projection({
+          //地图投影类型
+          code: "EPSG:3857",
+          units: "degrees",
+          //extent:extent
+        });
+
+        var aerial = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
+              "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+              "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "卫星影像图",
+        });
+
+        var yingxzi = new ol.layer.Tile({
+          source: new ol.source.XYZ({
+            url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+          }),
+          isGroup: true,
+          name: "天地图文字标注--卫星影像图",
+        });
+        //获取坐标是否存在
+        var Zb;
+        if (this.tGeoOrganizationLng != null && this.tGeoOrganizationLat != null) {
+          Zb = [this.tGeoOrganizationLng, this.tGeoOrganizationLat]
+        } else {
+          Zb = [115.452752, 31.789033];
+        }
+        //加载地图
+        map = new ol.Map({
+          controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
+          layers: [aerial, yingxzi],
+          projection: projection,
+          logo: 'false',
+          target: "mapWrap1",
+          view: new ol.View({
+            center: ol.proj.fromLonLat(Zb),
+            //center: ol.proj.fromLonLat([115.452752, 31.789033]),
+            zoom: 16.9,
+            minZoom: minMapZoom, //地图缩小限制
+            maxZoom: maxMapZoom, //地图放大限制
+          }),
+        });
+
+        //图层查询定位结束 ---------end
+        //开始绘制地图
+        $("#drawPolygon1").click(function () {
+          //map.removeLayer(hc_land);
+          map.removeLayer(vector_drawing);
+          that.drawInsert = null;
+          map.removeInteraction(draw);
+          var source = new ol.source.Vector({wrapX: false});
+          vector_drawing = new ol.layer.Vector({
+            source: source,
+          });
+          map.addLayer(vector_drawing);
+          var typeSelect = "Polygon";
+
+          function addInteraction() {
+            var value = typeSelect;
+            draw = new ol.interaction.Draw({
+              source: source,
+              type: typeSelect
+            });
+            draw.on('drawend', function (evt) {
+              console.log(that.drawInsert);
+              if(that.drawInsert != null){
+                $("#drawRemove1").trigger('click');
+              }
+              var feature = evt.feature;
+              var geometry = feature.getGeometry();
+              var coordinate = geometry.getCoordinates();
+              that.drawInsert = coordinate;
+              map.removeInteraction(draw);
+            });
+            map.addInteraction(draw);
+          }
+          addInteraction();
+        });
+        //清除画图鼠标点击事件
+        $("#drawRemove1").click(function () {
+          that.drawInsert = null;
+          map.removeInteraction(draw);
+          map.removeLayer(vector_drawing);
+        });
+      }
+    },
   },
 }
 </script>
@@ -914,7 +1376,6 @@
   .submitButton{
     width: 80%;
     margin: 0 auto;
-    background-color: #1D6FE9;
     border-radius: 14px;
   }
   .timeTit{
diff --git a/src/views/onlineHome/homestead/paidUtilize/paidUtilizeAdd.vue b/src/views/onlineHome/homestead/paidUtilize/paidUtilizeAdd.vue
new file mode 100644
index 00000000..8d6eaed5
--- /dev/null
+++ b/src/views/onlineHome/homestead/paidUtilize/paidUtilizeAdd.vue
@@ -0,0 +1,321 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">添加有偿使用</p>
+      </template>
+    </van-nav-bar>
+    <div class="main_box">
+      <van-field
+        readonly
+        clickable
+        v-model="circulation.shyqrdm"
+        label="使用权人"
+        placeholder="请选择"
+        @click="showshyqrdm = true"
+        input-align="right"
+        right-icon="arrow-down"
+      />
+      <van-popup v-model="showshyqrdm" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="shyqrdmDictionaries"
+          @confirm="onConfirmShyqrdm"
+          @cancel="showshyqrdm = false"
+        />
+      </van-popup>
+      <van-field
+        readonly
+        clickable
+        v-model="circulation.zjddm"
+        label="宅基地代码"
+        placeholder="请选择"
+        @click="showzjddm = true"
+        input-align="right"
+        right-icon="arrow-down"
+      />
+      <van-popup v-model="showzjddm" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="zjdDictionaries"
+          @confirm="onConfirmZjddm"
+          @cancel="showzjddm = false"
+        />
+      </van-popup>
+<!--      <van-field v-model="circulation.sqrxm" label="申请人姓名" placeholder="申请人姓名" input-align="right" label-width="auto"/>-->
+      <van-field
+        readonly
+        clickable
+        v-model="zjlx"
+        label="申请人证件类型"
+        placeholder="请选择"
+        @click="showzjlx = true"
+        input-align="right"
+        right-icon="arrow-down"
+        label-width="auto"
+      />
+      <van-popup v-model="showzjlx" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="zjlxDictionaries"
+          @confirm="onConfirmZjlx"
+          @cancel="showzjlx = false"
+        />
+      </van-popup>
+      <van-field v-model="circulation.sqrzjhm" label="申请人证件号码" placeholder="申请人证件号码" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.ycsyfs" label="有偿使用方式" placeholder="有偿使用方式" input-align="right" label-width="auto"/>
+
+
+      <van-cell title="是否一户多宅">
+        <template #right-icon>
+<!--          @change="designPaperChange"-->
+          <van-radio-group v-model="circulation.sfyhdz" direction="horizontal">
+            <van-radio name="Y">是</van-radio>
+            <van-radio name="N">否</van-radio  >
+          </van-radio-group>
+        </template>
+      </van-cell>
+
+      <van-field
+        readonly
+        clickable
+        name="picker"
+        v-model="circulation.ycsykssj"
+        label="有偿使用开始时间"
+        placeholder="选择开始时间"
+        @click="showycsykssj = true"
+        input-align="right"
+        right-icon="arrow-down"
+        label-width="auto"
+      />
+      <van-popup v-model="showycsykssj" position="bottom">
+        <van-datetime-picker
+          v-model="currentDate"
+          type="date"
+          title="选择年月日"
+          :min-date="minDate"
+          :max-date="maxDate"
+          @confirm="onConfirmYcsykssj"
+        />
+      </van-popup>
+
+      <van-field
+        readonly
+        clickable
+        name="picker"
+        v-model="circulation.ycsydqsj"
+        label="有偿使用到期时间"
+        placeholder="选择到期时间"
+        @click="showycsydqsj = true"
+        input-align="right"
+        right-icon="arrow-down"
+        label-width="auto"
+      />
+      <van-popup v-model="showycsydqsj" position="bottom">
+        <van-datetime-picker
+          v-model="currentDate"
+          type="date"
+          title="选择年月日"
+          :min-date="minDate"
+          :max-date="maxDate"
+          @confirm="onConfirmYcsydqsj"
+        />
+      </van-popup>
+
+      <van-field v-model="circulation.ycsymj" label="有偿使用面积(㎡)" placeholder="请输入有偿使用面积㎡" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.ycsymjdj" label="有偿使用面积单价(元)" placeholder="请输入有偿使用面积单价" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.ycsyfy" label="有偿使用费用(元)" placeholder="请输入有偿使用费用" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.fkfs" label="付款方式" placeholder="请输入付款方式" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.bz" label="备注" placeholder="请输入内容" input-align="right" label-width="auto"/>
+
+    </div>
+
+    <div style="padding: 16px 0;">
+      <van-row>
+        <van-col span="12" align="center">
+          <van-button type="info" color="#B4B0B0" native-type="submit" class="submitButton" @click="goEdit">取消</van-button>
+        </van-col>
+        <van-col span="12" align="center">
+          <van-button type="info" native-type="submit" class="submitButton" @click="goSubmit">保存</van-button>
+        </van-col>
+      </van-row>
+      <div class="clear"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { zjdzd } from "@/api/onlineHome/homestead/circulation";
+  import { ycsyAdd , listByDeptId } from "@/api/onlineHome/homestead/paidUtilize";
+  export default {
+    name: "paidUtilizeAdd",
+    data() {
+      return {
+        tcqllxDictionaries:[],//退出权利类型
+        tclxDictionaries:[],//退出类型
+        tcfsDictionaries:[],//退出方式
+        zjlxDictionaries:[],//申请人证件类型
+        bcfsDictionaries:[],//补偿方式
+        zjdDictionaries:[],//宅基地代码
+        shyqrdmDictionaries:[],//使用权人
+
+        tcqllx:'',
+        tclx:'',
+        tcfs:'',
+        zjlx:'',
+        bcfs:'',
+        zjddm:'',
+
+        showtcqllx: false,
+        showtclx: false,
+        showtcfs: false,
+        showzjlx: false,
+        showbcfs: false,
+        showzjddm: false,
+        showshyqrdm: false,
+        showycsykssj: false,
+        showycsydqsj: false,
+
+        circulation:{},
+        minDate: new Date(),
+        maxDate: new Date(2025, 10, 1),
+        currentDate: new Date(),
+      };
+    },
+    created() {
+      this.getDictionaries();
+    },
+    methods: {
+      getDictionaries(){
+          //退出权利类型
+          this.houseGetDicts("tcqllx").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.tcqllxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+          });
+          //退出类型
+          this.houseGetDicts("tclx").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.tclxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+          });
+          //退出方式
+          this.houseGetDicts("tcfs").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.tcfsDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+          });
+          //申请人证件类型
+          this.houseGetDicts("zjlx").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.zjlxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+          });
+          //补偿方式
+          this.houseGetDicts("bcfs").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.bcfsDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+          });
+          //宅基地代码
+          zjdzd().then(zjdRes => {
+            for (let i = 0; i < zjdRes.rows.length; i++) {
+              this.zjdDictionaries.push(zjdRes.rows[i].zjddm);
+            }
+          });
+          //使用权人代码
+          listByDeptId().then(zjdRes => {
+            for (let i = 0; i < zjdRes.rows.length; i++) {
+              this.shyqrdmDictionaries.push(zjdRes.rows[i].shyqrdm);
+            }
+          });
+      },
+      onConfirmZjddm(data){
+        console.log(data)
+        this.circulation.zjddm = data;
+        this.showzjddm = false;
+      },
+      onConfirmZjlx(data){
+        this.zjlx = data.text;
+        this.circulation.sqrzjlx = data.value;
+        this.showzjlx = false;
+      },
+      onConfirmTcqllx(data){
+        this.tcqllx = data.text;
+        this.circulation.tcqllx = data.value;
+        this.showtcqllx = false;
+      },
+      onConfirmTclx(data){
+        this.tclx = data.text;
+        this.circulation.tclx = data.value;
+        this.showtclx = false;
+      },
+      onConfirmTcfs(data){
+        this.tcfs = data.text;
+        this.circulation.tcfs = data.value;
+        this.showtcfs = false;
+      },
+      onConfirmBcfs(data){
+        this.bcfs = data.text;
+        this.circulation.bcfs = data.value;
+        this.showbcfs = false;
+      },
+      onConfirmShyqrdm(data){
+        this.circulation.shyqrdm = data;
+        this.showshyqrdm = false;
+      },
+      onConfirmYcsykssj(data){
+        this.circulation.ycsykssj = this.getNowFormatDate(data).substr(0,10);
+        this.showycsykssj = false;
+      },
+      onConfirmYcsydqsj(data){
+        this.circulation.ycsydqsj = this.getNowFormatDate(data).substr(0,10);
+        this.showycsydqsj = false;
+      },
+      goEdit(){
+        window.location.replace("paidUtilizeList")
+      },
+      goSubmit(){
+        ycsyAdd(this.circulation).then(response => {
+          if(response.code = 200){
+            this.$toast.success('新增成功');
+            setTimeout(function(){
+              window.location.replace("paidUtilizeList")
+            },1000)
+          }
+        });
+      }
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+
+  }
+</style>
diff --git a/src/views/onlineHome/homestead/paidUtilize/paidUtilizeDteail.vue b/src/views/onlineHome/homestead/paidUtilize/paidUtilizeDteail.vue
new file mode 100644
index 00000000..8741d416
--- /dev/null
+++ b/src/views/onlineHome/homestead/paidUtilize/paidUtilizeDteail.vue
@@ -0,0 +1,235 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">查看有偿使用</p>
+      </template>
+    </van-nav-bar>
+    <div class="main_box">
+      <van-field
+        readonly
+        v-model="circulation.shyqrdm"
+        label="使用权人"
+        input-align="right"
+      />
+      <van-field
+        readonly
+        v-model="circulation.zjddm"
+        label="宅基地代码"
+        input-align="right"
+      />
+      <van-field
+        readonly
+        v-model="zjlx"
+        label="申请人证件类型"
+        input-align="right"
+        label-width="auto"
+      />
+      <van-field readonly v-model="circulation.sqrzjhm" label="申请人证件号码" placeholder="申请人证件号码" input-align="right" label-width="auto"/>
+      <van-field readonly v-model="circulation.ycsyfs" label="有偿使用方式" placeholder="有偿使用方式" input-align="right" label-width="auto"/>
+      <van-cell title="是否一户多宅">
+        <template #right-icon>
+          {{circulation.sfyhdz == 'Y' ? '是' : '否'}}
+        </template>
+      </van-cell>
+
+      <van-field
+        readonly
+        v-model="circulation.ycsykssj"
+        label="有偿使用开始时间"
+        input-align="right"
+        label-width="auto"
+      />
+      <van-field
+        readonly
+        v-model="circulation.ycsydqsj"
+        label="有偿使用到期时间"
+        input-align="right"
+        label-width="auto"
+      />
+      <van-field readonly v-model="circulation.ycsymj" label="有偿使用面积(㎡)" placeholder="请输入有偿使用面积㎡" input-align="right" label-width="auto"/>
+      <van-field readonly v-model="circulation.ycsymjdj" label="有偿使用面积单价(元)" placeholder="请输入有偿使用面积单价" input-align="right" label-width="auto"/>
+      <van-field readonly v-model="circulation.ycsyfy" label="有偿使用费用(元)" placeholder="请输入有偿使用费用" input-align="right" label-width="auto"/>
+      <van-field readonly v-model="circulation.fkfs" label="付款方式" placeholder="请输入付款方式" input-align="right" label-width="auto"/>
+      <van-field readonly v-model="circulation.bz" label="备注" placeholder="请输入内容" input-align="right" label-width="auto"/>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { zjdzd } from "@/api/onlineHome/homestead/circulation";
+  import { zyyctcEdit , getYcsy , ycsyEdit } from "@/api/onlineHome/homestead/paidUtilize";
+  export default {
+    name: "paidUtilizeDteail",
+    data() {
+      return {
+        tcqllxDictionaries:[],//退出权利类型
+        tclxDictionaries:[],//退出类型
+        tcfsDictionaries:[],//退出方式
+        zjlxDictionaries:[],//申请人证件类型
+        bcfsDictionaries:[],//补偿方式
+        zjdDictionaries:[],//宅基地代码
+        shyqrdmDictionaries:[],//使用权人
+
+        tcqllx:'',
+        tclx:'',
+        tcfs:'',
+        zjlx:'',
+        bcfs:'',
+        zjddm:'',
+
+        showtcqllx: false,
+        showtclx: false,
+        showtcfs: false,
+        showzjlx: false,
+        showbcfs: false,
+        showzjddm: false,
+        showshyqrdm: false,
+        showycsykssj: false,
+        showycsydqsj: false,
+
+        circulation:{},
+        minDate: new Date(),
+        maxDate: new Date(2025, 10, 1),
+        currentDate: new Date(),
+      };
+    },
+    created() {
+      this.getDictionaries();
+    },
+    methods: {
+      getDictionaries(){
+        getYcsy(this.$route.query.id).then(response => {
+          //退出权利类型
+          this.houseGetDicts("tcqllx").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.tcqllxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.tcqllx = this.selectDictLabel(res.data, response.data.tcqllx);
+          });
+          //退出类型
+          this.houseGetDicts("tclx").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.tclxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.tclx = this.selectDictLabel(res.data, response.data.tclx);
+          });
+          //退出方式
+          this.houseGetDicts("tcfs").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.tcfsDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.tcfs = this.selectDictLabel(res.data, response.data.tcfs);
+          });
+          //申请人证件类型
+          this.houseGetDicts("zjlx").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.zjlxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.zjlx = this.selectDictLabel(res.data, response.data.sqrzjlx);
+          });
+          //补偿方式
+          this.houseGetDicts("bcfs").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.bcfsDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.bcfs = this.selectDictLabel(res.data, response.data.bcfs);
+          });
+          //宅基地代码
+          zjdzd().then(zjdRes => {
+            for (let i = 0; i < zjdRes.rows.length; i++) {
+              this.zjdDictionaries.push(zjdRes.rows[i].zjddm);
+            }
+          });
+          this.circulation = response.data;
+        });
+      },
+      onConfirmZjddm(data){
+        console.log(data)
+        this.circulation.zjddm = data;
+        this.showzjddm = false;
+      },
+      onConfirmZjlx(data){
+        this.zjlx = data.text;
+        this.circulation.sqrzjlx = data.value;
+        this.showzjlx = false;
+      },
+      onConfirmTcqllx(data){
+        this.tcqllx = data.text;
+        this.circulation.tcqllx = data.value;
+        this.showtcqllx = false;
+      },
+      onConfirmTclx(data){
+        this.tclx = data.text;
+        this.circulation.tclx = data.value;
+        this.showtclx = false;
+      },
+      onConfirmTcfs(data){
+        this.tcfs = data.text;
+        this.circulation.tcfs = data.value;
+        this.showtcfs = false;
+      },
+      onConfirmBcfs(data){
+        this.bcfs = data.text;
+        this.circulation.bcfs = data.value;
+        this.showbcfs = false;
+      },
+      onConfirmShyqrdm(data){
+        this.circulation.shyqrdm = data;
+        this.showshyqrdm = false;
+      },
+      onConfirmYcsykssj(data){
+        this.circulation.ycsykssj = this.getNowFormatDate(data).substr(0,10);
+        this.showycsykssj = false;
+      },
+      onConfirmYcsydqsj(data){
+        this.circulation.ycsydqsj = this.getNowFormatDate(data).substr(0,10);
+        this.showycsydqsj = false;
+      },
+      goEdit(){
+        window.location.replace("paidUtilizeList")
+      },
+      goSubmit(){
+        ycsyEdit(this.circulation).then(response => {
+          if(response.code = 200){
+            this.$toast.success('修改成功');
+            setTimeout(function(){
+              window.location.replace("paidUtilizeList")
+            },1000)
+          }
+        });
+      }
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+
+  }
+</style>
diff --git a/src/views/onlineHome/homestead/paidUtilize/paidUtilizeList.vue b/src/views/onlineHome/homestead/paidUtilize/paidUtilizeList.vue
new file mode 100644
index 00000000..9252ad76
--- /dev/null
+++ b/src/views/onlineHome/homestead/paidUtilize/paidUtilizeList.vue
@@ -0,0 +1,186 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+        @click-right="goAdd"
+      >
+        <template #title>
+          <p style="font-weight: bold;">有偿使用</p>
+        </template>
+        <template #right>
+          <van-icon name="add" size="18" />
+        </template>
+      </van-nav-bar>
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="getList"
+      >
+        <van-swipe-cell v-for="(item,index) in applicationList" :key="index">
+          <van-cell :title="item.zjddm" :value="item.auditStatus" center :to="{name:'paidUtilizeDteail', query: {id:item.id}}" >
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_sy.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p>{{item.shyqrdm}}</p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button color="#7DDA4F" v-if="item.auditStatus=='草稿'" square text="提交" @click="goSubmit(item.id,index)" type="primary" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button square text="修改" v-if="item.auditStatus=='草稿'" :to="{name:'paidUtilizeModify', query: {id:item.id}}" type="info" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button square text="删除" v-if="item.auditStatus=='草稿'" @click="deleteList(item.id,index)" type="danger" class="delete-button" />
+              </van-col>
+            </van-row>
+          </template>
+        </van-swipe-cell>
+      </van-list>
+    </div>
+</template>
+
+<script>
+import { getList , removeList , submitApply } from "@/api/onlineHome/homestead/paidUtilize";
+export default {
+  name: "paidUtilizeList",
+  data() {
+    return {
+      applicationList:[],
+      houseApplyStatus:[],
+      tcqllxStatus:[],
+      tclxStatus:[],
+      tcfsStatus:[],
+      auditStatus:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        orderByColumn:'id',
+        isAsc:'desc'
+      }
+    };
+  },
+  created() {
+    this.houseGetDicts("tcqllx").then((res) => {
+      this.tcqllxStatus = res.data;
+    });
+    this.houseGetDicts("tclx").then((res) => {
+      this.tclxStatus = res.data;
+    });
+    this.houseGetDicts("tcfs").then((res) => {
+      this.tcfsStatus = res.data;
+    });
+    this.houseGetDicts("audit_status").then((res) => {
+      this.auditStatus = res.data;
+    });
+  },
+  methods: {
+    goAdd(){
+      window.location = 'paidUtilizeAdd';
+    },
+    getList(){
+      setTimeout(() => {
+        getList(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].tclx = this.selectDictLabel(this.tcqllxStatus, response.rows[i].tclx)
+            response.rows[i].tclx = this.selectDictLabel(this.tclxStatus, response.rows[i].tclx)
+            response.rows[i].tcfs = this.selectDictLabel(this.tcfsStatus, response.rows[i].tcfs)
+            response.rows[i].auditStatus = this.selectDictLabel(this.auditStatus, response.rows[i].auditStatus)
+            this.applicationList.push(response.rows[i]);
+          }
+          if(this.applicationList.length >= response.total){
+            this.finished = true;
+            return;
+          }else{
+            this.loading = false;
+            this.queryParams.pageNum += 1 ;
+          }
+        });
+      }, 1000);
+    },
+    deleteList(id,index){
+      this.$dialog.confirm({
+        message: '您确认删除申请草稿？',
+      })
+      .then(() => {
+        // on confirm
+        this.applicationList.splice(index,1)
+        removeList(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('删除成功');
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    },
+    goSubmit(id,index){
+      this.$dialog.confirm({
+        message: '您确认提交草稿？',
+      })
+      .then(() => {
+        // on confirm
+        submitApply(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('提交成功！');
+            setTimeout(function(){
+              history.go(0)
+            },2000)
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .delete-button {
+    height: 100%;
+  }
+  .van-row{
+    height: 100%;
+  }
+  .van-col{
+    height: 100%;
+  }
+</style>
diff --git a/src/views/onlineHome/homestead/paidUtilize/paidUtilizeModify.vue b/src/views/onlineHome/homestead/paidUtilize/paidUtilizeModify.vue
new file mode 100644
index 00000000..43777aac
--- /dev/null
+++ b/src/views/onlineHome/homestead/paidUtilize/paidUtilizeModify.vue
@@ -0,0 +1,329 @@
+<template>
+  <div class="app-container">
+    <van-nav-bar
+      left-arrow
+      fixed
+      placeholder
+      @click-left="$router.back(-1)"
+    >
+      <template #title>
+        <p style="font-weight: bold;">修改有偿使用</p>
+      </template>
+    </van-nav-bar>
+    <div class="main_box">
+      <van-field
+        readonly
+        clickable
+        v-model="circulation.shyqrdm"
+        label="使用权人"
+        placeholder="请选择"
+        @click="showshyqrdm = true"
+        input-align="right"
+        right-icon="arrow-down"
+      />
+      <van-popup v-model="showshyqrdm" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="shyqrdmDictionaries"
+          @confirm="onConfirmShyqrdm"
+          @cancel="showshyqrdm = false"
+        />
+      </van-popup>
+      <van-field
+        readonly
+        clickable
+        v-model="circulation.zjddm"
+        label="宅基地代码"
+        placeholder="请选择"
+        @click="showzjddm = true"
+        input-align="right"
+        right-icon="arrow-down"
+      />
+      <van-popup v-model="showzjddm" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="zjdDictionaries"
+          @confirm="onConfirmZjddm"
+          @cancel="showzjddm = false"
+        />
+      </van-popup>
+<!--      <van-field v-model="circulation.sqrxm" label="申请人姓名" placeholder="申请人姓名" input-align="right" label-width="auto"/>-->
+      <van-field
+        readonly
+        clickable
+        v-model="zjlx"
+        label="申请人证件类型"
+        placeholder="请选择"
+        @click="showzjlx = true"
+        input-align="right"
+        right-icon="arrow-down"
+        label-width="auto"
+      />
+      <van-popup v-model="showzjlx" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="zjlxDictionaries"
+          @confirm="onConfirmZjlx"
+          @cancel="showzjlx = false"
+        />
+      </van-popup>
+      <van-field v-model="circulation.sqrzjhm" label="申请人证件号码" placeholder="申请人证件号码" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.ycsyfs" label="有偿使用方式" placeholder="有偿使用方式" input-align="right" label-width="auto"/>
+
+
+      <van-cell title="是否一户多宅">
+        <template #right-icon>
+<!--          @change="designPaperChange"-->
+          <van-radio-group v-model="circulation.sfyhdz" direction="horizontal">
+            <van-radio name="Y">是</van-radio>
+            <van-radio name="N">否</van-radio  >
+          </van-radio-group>
+        </template>
+      </van-cell>
+
+      <van-field
+        readonly
+        clickable
+        name="picker"
+        v-model="circulation.ycsykssj"
+        label="有偿使用开始时间"
+        placeholder="选择开始时间"
+        @click="showycsykssj = true"
+        input-align="right"
+        right-icon="arrow-down"
+        label-width="auto"
+      />
+      <van-popup v-model="showycsykssj" position="bottom">
+        <van-datetime-picker
+          v-model="currentDate"
+          type="date"
+          title="选择年月日"
+          :min-date="minDate"
+          :max-date="maxDate"
+          @confirm="onConfirmYcsykssj"
+        />
+      </van-popup>
+
+      <van-field
+        readonly
+        clickable
+        name="picker"
+        v-model="circulation.ycsydqsj"
+        label="有偿使用到期时间"
+        placeholder="选择到期时间"
+        @click="showycsydqsj = true"
+        input-align="right"
+        right-icon="arrow-down"
+        label-width="auto"
+      />
+      <van-popup v-model="showycsydqsj" position="bottom">
+        <van-datetime-picker
+          v-model="currentDate"
+          type="date"
+          title="选择年月日"
+          :min-date="minDate"
+          :max-date="maxDate"
+          @confirm="onConfirmYcsydqsj"
+        />
+      </van-popup>
+
+      <van-field v-model="circulation.ycsymj" label="有偿使用面积(㎡)" placeholder="请输入有偿使用面积㎡" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.ycsymjdj" label="有偿使用面积单价(元)" placeholder="请输入有偿使用面积单价" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.ycsyfy" label="有偿使用费用(元)" placeholder="请输入有偿使用费用" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.fkfs" label="付款方式" placeholder="请输入付款方式" input-align="right" label-width="auto"/>
+      <van-field v-model="circulation.bz" label="备注" placeholder="请输入内容" input-align="right" label-width="auto"/>
+
+    </div>
+
+    <div style="padding: 16px 0;">
+      <van-row>
+        <van-col span="12" align="center">
+          <van-button type="info" color="#B4B0B0" native-type="submit" class="submitButton" @click="goEdit">取消</van-button>
+        </van-col>
+        <van-col span="12" align="center">
+          <van-button type="info" native-type="submit" class="submitButton" @click="goSubmit">保存</van-button>
+        </van-col>
+      </van-row>
+      <div class="clear"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { zjdzd } from "@/api/onlineHome/homestead/circulation";
+  import { listByDeptId , getYcsy , ycsyEdit } from "@/api/onlineHome/homestead/paidUtilize";
+  export default {
+    name: "paidUtilizeModify",
+    data() {
+      return {
+        tcqllxDictionaries:[],//退出权利类型
+        tclxDictionaries:[],//退出类型
+        tcfsDictionaries:[],//退出方式
+        zjlxDictionaries:[],//申请人证件类型
+        bcfsDictionaries:[],//补偿方式
+        zjdDictionaries:[],//宅基地代码
+        shyqrdmDictionaries:[],//使用权人
+
+        tcqllx:'',
+        tclx:'',
+        tcfs:'',
+        zjlx:'',
+        bcfs:'',
+        zjddm:'',
+
+        showtcqllx: false,
+        showtclx: false,
+        showtcfs: false,
+        showzjlx: false,
+        showbcfs: false,
+        showzjddm: false,
+        showshyqrdm: false,
+        showycsykssj: false,
+        showycsydqsj: false,
+
+        circulation:{},
+        minDate: new Date(),
+        maxDate: new Date(2025, 10, 1),
+        currentDate: new Date(),
+      };
+    },
+    created() {
+      this.getDictionaries();
+    },
+    methods: {
+      getDictionaries(){
+        getYcsy(this.$route.query.id).then(response => {
+          //退出权利类型
+          this.houseGetDicts("tcqllx").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.tcqllxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.tcqllx = this.selectDictLabel(res.data, response.data.tcqllx);
+          });
+          //退出类型
+          this.houseGetDicts("tclx").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.tclxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.tclx = this.selectDictLabel(res.data, response.data.tclx);
+          });
+          //退出方式
+          this.houseGetDicts("tcfs").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.tcfsDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.tcfs = this.selectDictLabel(res.data, response.data.tcfs);
+          });
+          //申请人证件类型
+          this.houseGetDicts("zjlx").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.zjlxDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.zjlx = this.selectDictLabel(res.data, response.data.sqrzjlx);
+          });
+          //补偿方式
+          this.houseGetDicts("bcfs").then((res) => {
+            for (var i = 0; i < res.data.length; i++) {
+              this.bcfsDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
+            }
+            this.bcfs = this.selectDictLabel(res.data, response.data.bcfs);
+          });
+          //宅基地代码
+          zjdzd().then(zjdRes => {
+            for (let i = 0; i < zjdRes.rows.length; i++) {
+              this.zjdDictionaries.push(zjdRes.rows[i].zjddm);
+            }
+          });
+          //使用权人代码
+          listByDeptId().then(zjdRes => {
+            for (let i = 0; i < zjdRes.rows.length; i++) {
+              this.shyqrdmDictionaries.push(zjdRes.rows[i].shyqrdm);
+            }
+          });
+          this.circulation = response.data;
+        });
+      },
+      onConfirmZjddm(data){
+        console.log(data)
+        this.circulation.zjddm = data;
+        this.showzjddm = false;
+      },
+      onConfirmZjlx(data){
+        this.zjlx = data.text;
+        this.circulation.sqrzjlx = data.value;
+        this.showzjlx = false;
+      },
+      onConfirmTcqllx(data){
+        this.tcqllx = data.text;
+        this.circulation.tcqllx = data.value;
+        this.showtcqllx = false;
+      },
+      onConfirmTclx(data){
+        this.tclx = data.text;
+        this.circulation.tclx = data.value;
+        this.showtclx = false;
+      },
+      onConfirmTcfs(data){
+        this.tcfs = data.text;
+        this.circulation.tcfs = data.value;
+        this.showtcfs = false;
+      },
+      onConfirmBcfs(data){
+        this.bcfs = data.text;
+        this.circulation.bcfs = data.value;
+        this.showbcfs = false;
+      },
+      onConfirmShyqrdm(data){
+        this.circulation.shyqrdm = data;
+        this.showshyqrdm = false;
+      },
+      onConfirmYcsykssj(data){
+        this.circulation.ycsykssj = this.getNowFormatDate(data).substr(0,10);
+        this.showycsykssj = false;
+      },
+      onConfirmYcsydqsj(data){
+        this.circulation.ycsydqsj = this.getNowFormatDate(data).substr(0,10);
+        this.showycsydqsj = false;
+      },
+      goEdit(){
+        window.location.replace("paidUtilizeList")
+      },
+      goSubmit(){
+        ycsyEdit(this.circulation).then(response => {
+          if(response.code = 200){
+            this.$toast.success('修改成功');
+            setTimeout(function(){
+              window.location.replace("paidUtilizeList")
+            },1000)
+          }
+        });
+      }
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 6px;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+
+  }
+</style>
diff --git a/src/views/onlineHome/workbench.vue b/src/views/onlineHome/workbench.vue
index 1af9e31e..cd4b3515 100644
--- a/src/views/onlineHome/workbench.vue
+++ b/src/views/onlineHome/workbench.vue
@@ -379,26 +379,34 @@
             </div>
             <p style="margin-top: 5px;color: #666666;">公示信息</p>
           </van-grid-item>
+          <van-grid-item text="有偿利用" :to="{name:'paidUtilizeList'}" >
+            <div slot="default">
+              <div style="background:#FFA63E;padding: 10px;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px ">
+                <img src="../../../static/images/onlineHome/icon22.png" style="width: 25px" alt />
+              </div>
+            </div>
+            <p style="margin-top: 5px;color: #666666;">有偿利用</p>
+          </van-grid-item>
           <van-grid-item text="任务上报" :to="{name:'taskReportingList'}" >
             <div slot="default">
-              <div style="background:#c568f5;padding: 10px;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px ">
-                <img src="../../../static/images/onlineHome/icon_zjd3.png" style="width: 25px" alt />
+              <div style="background:#1D6FE9;padding: 10px;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px ">
+                <img src="../../../static/images/onlineHome/icon21.png" style="width: 25px" alt />
               </div>
             </div>
             <p style="margin-top: 5px;color: #666666;">任务上报</p>
           </van-grid-item>
           <van-grid-item text="任务发布" :to="{name:'task'}" >
             <div slot="default">
-              <div style="background:#c568f5;padding: 10px;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px ">
-                <img src="../../../static/images/onlineHome/icon_zjd3.png" style="width: 25px" alt />
+              <div style="background:#1D6FE9;padding: 10px;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px ">
+                <img src="../../../static/images/onlineHome/icon21.png" style="width: 25px" alt />
               </div>
             </div>
             <p style="margin-top: 5px;color: #666666;">任务发布</p>
           </van-grid-item>
           <van-grid-item text="违法监管" :to="{name:'supervisionList'}" >
             <div slot="default">
-              <div style="background:#c568f5;padding: 10px;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px ">
-                <img src="../../../static/images/onlineHome/icon_zjd3.png" style="width: 25px" alt />
+              <div style="background:#1D6FE9;padding: 10px;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px ">
+                <img src="../../../static/images/onlineHome/icon21.png" style="width: 25px" alt />
               </div>
             </div>
             <p style="margin-top: 5px;color: #666666;">违法监管</p>
diff --git a/static/images/icon/icon_sy.png b/static/images/icon/icon_sy.png
new file mode 100644
index 00000000..cfdb1f21
Binary files /dev/null and b/static/images/icon/icon_sy.png differ
diff --git a/static/images/onlineHome/icon21.png b/static/images/onlineHome/icon21.png
new file mode 100644
index 00000000..c8263f66
Binary files /dev/null and b/static/images/onlineHome/icon21.png differ
diff --git a/static/images/onlineHome/icon22.png b/static/images/onlineHome/icon22.png
new file mode 100644
index 00000000..f4dcde92
Binary files /dev/null and b/static/images/onlineHome/icon22.png differ