From 8700bf5a20bb9c54152d3f67d619dae4d87933e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BA=9E=E4=B8=9C=E6=97=AD?= <850374051@qq.com>
Date: Mon, 6 Sep 2021 10:17:18 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=85=E5=9F=BA=E5=9C=B0=E7=A7=BB=E5=8A=A8?=
 =?UTF-8?q?=E7=AB=AF=E6=8E=A5=E5=8F=A3=E5=AF=B9=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../onlineHome/homestead/homesteadUtilize.js  |  52 ++
 src/api/onlineHome/homestead/utilization.js   |  62 +++
 src/router/index.js                           |  36 ++
 .../homesteadUtilize/homesteadUtilize.vue     | 104 +++-
 .../homesteadUtilize/homesteadUtilizeAdd.vue  | 239 ++++++----
 .../homesteadUtilizeDetail.vue                |  98 ++++
 .../homesteadUtilizeModify.vue                | 210 +++++++++
 .../homestead/utilization/utilizationAdd.vue  | 220 ++++++---
 .../utilization/utilizationDetail.vue         | 121 +++++
 .../homestead/utilization/utilizationList.vue | 109 ++++-
 .../utilization/utilizationModify.vue         | 444 ++++++++++++++++++
 src/views/onlineHome/workbench.vue            |  71 +++
 12 files changed, 1563 insertions(+), 203 deletions(-)
 create mode 100644 src/api/onlineHome/homestead/homesteadUtilize.js
 create mode 100644 src/api/onlineHome/homestead/utilization.js
 create mode 100644 src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeDetail.vue
 create mode 100644 src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeModify.vue
 create mode 100644 src/views/onlineHome/homestead/utilization/utilizationDetail.vue
 create mode 100644 src/views/onlineHome/homestead/utilization/utilizationModify.vue

diff --git a/src/api/onlineHome/homestead/homesteadUtilize.js b/src/api/onlineHome/homestead/homesteadUtilize.js
new file mode 100644
index 00000000..6e1dbe76
--- /dev/null
+++ b/src/api/onlineHome/homestead/homesteadUtilize.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+
+//查询列表
+export function getList(data){
+  return request({
+    url:'/house/mobile/zjdly/list',
+    method:'get',
+    params:data
+  })
+}
+
+//删除列表项
+export function zjdlyRemove(id){
+  return request({
+    url:'/house/zjdly/remove/'+id,
+    method:'get'
+  })
+}
+
+//宅基地流转详情
+export function getZjdly(id){
+  return request({
+    url:'/house/zjdly/get/'+id,
+    method:'get'
+  })
+}
+
+//宅基地流转添加
+export function zjdlyAdd(data){
+  return request({
+    url:'/house/zjdly/add',
+    method:'post',
+    data:data
+  })
+}
+
+//宅基地流转保存
+export function zjdlyEdit(data){
+  return request({
+    url:'/house/zjdly/edit',
+    method:'post',
+    data:data
+  })
+}
+
+//宅基地流转提交
+export function zyyctcApply(id){
+  return request({
+    url:'/house/zyyctc/submitApply/'+id,
+    method:'post',
+  })
+}
diff --git a/src/api/onlineHome/homestead/utilization.js b/src/api/onlineHome/homestead/utilization.js
new file mode 100644
index 00000000..938eaee6
--- /dev/null
+++ b/src/api/onlineHome/homestead/utilization.js
@@ -0,0 +1,62 @@
+import request from '@/utils/request'
+
+//查询列表
+export function getList(data){
+  return request({
+    url:'/house/mobile/nmfwly/list',
+    method:'get',
+    params:data
+  })
+}
+
+//删除列表项
+export function nmfwlyRemove(id){
+  return request({
+    url:'/house/nmfwly/remove/'+id,
+    method:'get'
+  })
+}
+
+//宅基地流转详情
+export function getZjdly(id){
+  return request({
+    url:'/house/nmfwly/get/'+id,
+    method:'get'
+  })
+}
+
+//宅基地流转详情
+export function nmfwlyAdd(data){
+  return request({
+    url:'/house/nmfwly/add',
+    method:'post',
+    data:data
+  })
+}
+
+//宅基地流转保存
+export function nmfwlyEdit(data){
+  return request({
+    url:'/house/nmfwly/edit',
+    method:'post',
+    data:data
+  })
+}
+
+//宅基地流转提交
+export function zyyctcApply(id){
+  return request({
+    url:'/house/zyyctc/submitApply/'+id,
+    method:'post',
+  })
+}
+
+//上传图片
+export function upload(data){
+  return request({
+    url:'/common/upload',
+    method:'post',
+    headers:{'Content-Type': 'application/x-www-form-urlencoded;boundary=----WebKitFormBoundary7MA4YWxkTrZu0gW'},
+    data:data
+  })
+}
diff --git a/src/router/index.js b/src/router/index.js
index ffedcae7..4568f130 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -708,6 +708,15 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/onlineHome/homestead/utilization/utilizationList'], resolve)
   },
+  {
+    path: '/utilizationDetail',
+    name: 'utilizationDetail',
+    meta: {
+      title: '农房利用',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/utilization/utilizationDetail'], resolve)
+  },
   {
     path: '/utilizationAdd',
     name: 'utilizationAdd',
@@ -717,6 +726,15 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/onlineHome/homestead/utilization/utilizationAdd'], resolve)
   },
+  {
+    path: '/utilizationModify',
+    name: 'utilizationModify',
+    meta: {
+      title: '农房利用',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/utilization/utilizationModify'], resolve)
+  },
   {
     path: '/homesteadUtilize',
     name: 'homesteadUtilize',
@@ -735,6 +753,24 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeAdd'], resolve)
   },
+  {
+    path: '/homesteadUtilizeDetail',
+    name: 'homesteadUtilizeDetail',
+    meta: {
+      title: '宅基地利用情况',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeDetail'], resolve)
+  },
+  {
+    path: '/homesteadUtilizeModify',
+    name: 'homesteadUtilizeModify',
+    meta: {
+      title: '宅基地利用情况',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeModify'], resolve)
+  },
   {
     path: '/circulationDetail',
     name: 'circulationDetail',
diff --git a/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilize.vue b/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilize.vue
index 5ca418af..29f4aa6a 100644
--- a/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilize.vue
+++ b/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilize.vue
@@ -5,6 +5,7 @@
         fixed
         placeholder
         @click-left="$router.back(-1)"
+        @click-right="goAdd"
       >
         <template #title>
           <p style="font-weight: bold;">宅基地利用情况</p>
@@ -13,42 +14,99 @@
           <van-icon name="add" size="18" />
         </template>
       </van-nav-bar>
-      <van-swipe-cell v-for="(item,index) in 10">
-        <van-cell title="440604100202000000Z00012" center >
-          <template #icon>
-            <van-icon name="../../../static/images/icon/icon_ly.png" size="22" color="#539FFD" style="margin-right: 10px;" />
-          </template>
-          <template #label>
-            <p><b style="color: #7DDA4F;">正常使用</b><i style="margin-right: 0.5rem;"></i><b style="color: #333333;">自住</b><i style="margin-right: 0.5rem;"></i>闲置<span style="float: right">2021-08-14</span></p>
+      <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" center :to="{name:'homesteadUtilizeDetail', query: {id:item.id}}" >
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_ly.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><b style="color: #7DDA4F;">{{item.zjdlyzk}}</b><i style="margin-right: 0.5rem;"></i>{{item.zjdxzyy}}<span style="float: right">{{item.dcsj}}</span></p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button square text="修改" :to="{name:'homesteadUtilizeModify', query: {id:item.id}}" type="info" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button square text="删除" @click="deleteList(item.id,index)" type="danger" class="delete-button" />
+              </van-col>
+            </van-row>
           </template>
-        </van-cell>
-        <template #right>
-          <van-row>
-            <van-col>
-              <van-button square text="修改" type="info" class="delete-button" />
-            </van-col>
-            <van-col>
-              <van-button square text="删除" type="danger" class="delete-button" />
-            </van-col>
-          </van-row>
-        </template>
-      </van-swipe-cell>
+        </van-swipe-cell>
+      </van-list>
     </div>
 </template>
 
 <script>
+import { getList , zjdlyRemove } from "@/api/onlineHome/homestead/homesteadUtilize";
 export default {
-    name: "paidExit",
+  name: "homesteadUtilize",
   data() {
     return {
-
+      applicationList:[],
+      zjdlyzkStatus:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        orderByColumn:'createTime',
+        isAsc:'desc'
+      }
     };
   },
   created() {
-
+    this.houseGetDicts("zjdlyzk").then((res) => {
+      console.log(res)
+      this.zjdlyzkStatus = res.data;
+    });
   },
   methods: {
-
+    goAdd(){
+      window.location = 'homesteadUtilizeAdd';
+    },
+    getList(){
+      setTimeout(() => {
+        getList(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].zjdlyzk = this.selectDictLabel(this.zjdlyzkStatus, response.rows[i].zjdlyzk)
+            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)
+          zjdlyRemove(id).then(res => {
+            if(res.code = 200){
+              this.$toast.success('删除成功');
+            }
+          });
+        })
+        .catch(() => {
+          // on cancel
+        });
+    }
   },
 }
 </script>
diff --git a/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeAdd.vue b/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeAdd.vue
index 08a6a3ee..bbbfbd17 100644
--- a/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeAdd.vue
+++ b/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeAdd.vue
@@ -10,123 +10,166 @@
           <p style="font-weight: bold;">宅基地利用情况</p>
         </template>
       </van-nav-bar>
-      <van-form @submit="onSubmit">
-        <div class="main_box">
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="宅基地代码"
-            placeholder="请选择"
-            @click="showPicker = true"
-            input-align="right"
-            right-icon="arrow-down"
+      <div class="main_box">
+        <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 v-model="showPicker" position="bottom">
-            <van-picker
-              show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
-            />
-          </van-popup>
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="宅基地利用情况"
-            placeholder="请选择"
-            @click="showPicker = true"
-            input-align="right"
-            right-icon="arrow-down"
-            label-width="auto"
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          v-model="zjdlyzk"
+          label="宅基地利用情况"
+          placeholder="请选择"
+          @click="showzjdlyzk = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showzjdlyzk" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="zjdlyzkDictionaries"
+            @confirm="onConfirmZjdlyzk"
+            @cancel="showzjdlyzk = false"
           />
-          <van-popup v-model="showPicker" position="bottom">
-            <van-picker
-              show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
-            />
-          </van-popup>
-          <van-field label="宅基地闲置原因" placeholder="闲置原因" input-align="right" label-width="auto"/>
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="宅基地闲置起始时间"
-            placeholder="宅基地闲置起始时间"
-            @click="showPicker1 = true"
-            input-align="right"
-            right-icon="arrow-down"
-            label-width="auto"
+        </van-popup>
+        <van-field v-model="circulation.zjdxzyy" label="宅基地闲置原因" placeholder="闲置原因" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          v-model="circulation.zjdxzqssj"
+          label="宅基地闲置开始时间"
+          placeholder="宅基地闲置开始时间"
+          @click="showzjdxzqssj = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showzjdxzqssj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmZjdxzqssj"
           />
-          <van-popup v-model="showPicker1" position="bottom">
-            <van-datetime-picker
-              v-model="currentDate"
-              type="date"
-              title="选择年月日"
-              :min-date="minDate"
-              :max-date="maxDate"
-            />
-          </van-popup>
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="调查事件"
-            placeholder="调查事件"
-            @click="showPicker1 = true"
-            input-align="right"
-            right-icon="arrow-down"
-            label-width="auto"
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          v-model="circulation.dcsj"
+          label="调查时间"
+          placeholder="调查时间"
+          @click="showdcsj = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showdcsj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmDcsj"
           />
-          <van-field label="备注" type="textarea" placeholder="请输入内容" input-align="right" label-width="auto"/>
-        </div>
+        </van-popup>
+        <van-field v-model="circulation.bz" label="备注" type="textarea" 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">关闭</van-button>
-            </van-col>
-            <van-col span="12" align="center">
-              <van-button type="info" native-type="submit" class="submitButton">保存</van-button>
-            </van-col>
-          </van-row>
-          <div class="clear"></div>
-        </div>
-
-      </van-form>
+      <div style="padding: 16px 0;">
+        <van-row>
+          <van-col span="12" align="center">
+            <van-button type="info" color="#B4B0B0" native-type="submit" class="submitButton">关闭</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 { zjdlyAdd } from "@/api/onlineHome/homestead/homesteadUtilize";
 export default {
-    name: "circulationAdd",
+    name: "homesteadUtilizeAdd",
   data() {
     return {
-      value: '',
-      columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
-      showPicker: false,
-      showPicker1: false,
-      minDate: new Date(2020, 0, 1),
+      zjdlyzk:'',//宅基地利用状况
+      zjdlyzkDictionaries:[],//宅基地利用状况 字典
+      circulation:{},
+      zjdDictionaries:[],
+      zjdlyzkDictionaries: [],//宅基地利用状况 字典 zjdlyzk
+      showzjddm : false ,
+      showzjdlyzk : false ,
+      showzjdxzqssj : false ,
+      showdcsj : false ,
+
+      minDate: new Date(),
       maxDate: new Date(2025, 10, 1),
-      currentDate: new Date(2021, 0, 17),
-      findList:[]
+      currentDate: new Date(),
     };
   },
   created() {
-
+    this.houseGetDicts("zjdlyzk").then((res) => {
+      for(var i = 0 ; i < res.data.length ; i++){
+        this.zjdlyzkDictionaries.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);
+      }
+    });
   },
   methods: {
-    onConfirm(value) {
-      this.value = value;
-      this.showPicker = false;
+    onConfirmZjddm(data){
+      console.log(data)
+      this.circulation.zjddm = data;
+      this.showzjddm = false;
+    },
+    onConfirmZjdlyzk(data){
+      this.zjdlyzk = data.text;
+      this.circulation.zjdlyzk = data.value;
+      this.showzjdlyzk = false;
+    },
+    onConfirmZjdxzqssj(data){
+      this.circulation.zjdxzqssj = this.getNowFormatDate(data).substr(0,10);
+      this.showzjdxzqssj = false;
+    },
+    onConfirmDcsj(data){
+      this.circulation.dcsj = this.getNowFormatDate(data).substr(0,10);
+      this.showdcsj = false;
     },
+    goSubmit(){
+      console.log(this.circulation);
+      zjdlyAdd(this.circulation).then(response => {
+        if(response.code = 200){
+          this.$toast.success('保存成功');
+        }
+      });
+    }
   },
 }
 </script>
diff --git a/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeDetail.vue b/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeDetail.vue
new file mode 100644
index 00000000..bf4db7ad
--- /dev/null
+++ b/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeDetail.vue
@@ -0,0 +1,98 @@
+<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.zjddm"
+          label="宅基地代码"
+          input-align="right"
+        />
+        <van-field
+          readonly
+          v-model="circulation.zjdlyzk"
+          label="宅基地利用情况"
+          input-align="right"
+          label-width="auto"
+        />
+        <van-field label="宅基地闲置原因" v-model="circulation.zjdxzyy" readonly input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          v-model="circulation.zjdxzqssj"
+          label="宅基地闲置起始时间"
+          input-align="right"
+          label-width="auto"
+        />
+        <van-field
+          readonly
+          v-model="circulation.dcsj"
+          label="调查时间"
+          input-align="right"
+          label-width="auto"
+        />
+        <van-field label="备注" v-model="circulation.bz" readonly type="textarea" input-align="right" label-width="auto"/>
+      </div>
+    </div>
+</template>
+
+<script>
+import { getZjdly } from "@/api/onlineHome/homestead/homesteadUtilize";
+export default {
+  name: "homesteadUtilizeDetail",
+  data() {
+    return {
+      circulation:[]
+    };
+  },
+  created() {
+    this.getDetail();
+  },
+  methods: {
+    getDetail(){
+      getZjdly(this.$route.query.id).then(response => {
+        console.log(response)
+        //退出权利类型
+        this.houseGetDicts("zjdlyzk").then((res) => {
+          this.circulation.zjdlyzk = this.selectDictLabel(res.data, response.data.zjdlyzk);
+        });
+        this.circulation = response.data;
+      });
+    }
+  },
+}
+</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/homesteadUtilize/homesteadUtilizeModify.vue b/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeModify.vue
new file mode 100644
index 00000000..cf26cda2
--- /dev/null
+++ b/src/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeModify.vue
@@ -0,0 +1,210 @@
+<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.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
+          readonly
+          clickable
+          v-model="zjdlyzk"
+          label="宅基地利用情况"
+          placeholder="请选择"
+          @click="showzjdlyzk = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showzjdlyzk" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="zjdlyzkDictionaries"
+            @confirm="onConfirmZjdlyzk"
+            @cancel="showzjdlyzk = false"
+          />
+        </van-popup>
+        <van-field v-model="circulation.zjdxzyy" label="宅基地闲置原因" placeholder="闲置原因" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          v-model="circulation.zjdxzqssj"
+          label="宅基地闲置开始时间"
+          placeholder="宅基地闲置开始时间"
+          @click="showzjdxzqssj = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showzjdxzqssj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmZjdxzqssj"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          v-model="circulation.dcsj"
+          label="调查时间"
+          placeholder="调查时间"
+          @click="showdcsj = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showdcsj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmDcsj"
+          />
+        </van-popup>
+        <van-field v-model="circulation.bz" label="备注" type="textarea" 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">关闭</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 { zjdlyEdit , getZjdly } from "@/api/onlineHome/homestead/homesteadUtilize";
+export default {
+    name: "homesteadUtilizeModify",
+  data() {
+    return {
+      zjdlyzk:'',//宅基地利用状况
+      zjdlyzkDictionaries:[],//宅基地利用状况 字典
+      circulation:{},
+      zjdDictionaries:[],
+      zjdlyzkDictionaries: [],//宅基地利用状况 字典 zjdlyzk
+      showzjddm : false ,
+      showzjdlyzk : false ,
+      showzjdxzqssj : false ,
+      showdcsj : false ,
+
+      minDate: new Date(),
+      maxDate: new Date(2025, 10, 1),
+      currentDate: new Date(),
+    };
+  },
+  created() {
+    this.getDetail();
+
+  },
+  methods: {
+    getDetail(){
+      getZjdly(this.$route.query.id).then(response => {
+        console.log(response)
+        this.houseGetDicts("zjdlyzk").then((res) => {
+          for(var i = 0 ; i < res.data.length ; i++){
+            this.zjdlyzkDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+          }
+          this.zjdlyzk = this.selectDictLabel(res.data, response.data.zjdlyzk);
+        });
+        //宅基地代码
+        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;
+    },
+    onConfirmZjdlyzk(data){
+      this.zjdlyzk = data.text;
+      this.circulation.zjdlyzk = data.value;
+      this.showzjdlyzk = false;
+    },
+    onConfirmZjdxzqssj(data){
+      this.circulation.zjdxzqssj = this.getNowFormatDate(data).substr(0,10);
+      this.showzjdxzqssj = false;
+    },
+    onConfirmDcsj(data){
+      this.circulation.dcsj = this.getNowFormatDate(data).substr(0,10);
+      this.showdcsj = false;
+    },
+    goSubmit(){
+      console.log(this.circulation);
+      zjdlyEdit(this.circulation).then(response => {
+        if(response.code = 200){
+          this.$toast.success('保存成功');
+        }
+      });
+    }
+  },
+}
+</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/utilization/utilizationAdd.vue b/src/views/onlineHome/homestead/utilization/utilizationAdd.vue
index bb9127b7..964af6eb 100644
--- a/src/views/onlineHome/homestead/utilization/utilizationAdd.vue
+++ b/src/views/onlineHome/homestead/utilization/utilizationAdd.vue
@@ -10,170 +10,171 @@
           <p style="font-weight: bold;">农民房屋利用情况调查</p>
         </template>
       </van-nav-bar>
-      <van-form @submit="onSubmit">
         <div class="main_box">
           <van-field
             readonly
             clickable
             name="picker"
-            :value="value"
+            v-model="circulation.nmfwdm"
             label="农民房屋代码"
             placeholder="请选择"
-            @click="showPicker = true"
+            @click="showzjddm = true"
             input-align="right"
             right-icon="arrow-down"
           />
-          <van-popup v-model="showPicker" position="bottom">
+          <van-popup v-model="showzjddm" position="bottom">
             <van-picker
               show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
+              :columns="zjdDictionaries"
+              @confirm="onConfirmZjddm"
+              @cancel="showzjddm = false"
             />
           </van-popup>
           <van-field
             readonly
             clickable
             name="picker"
-            :value="value"
+            v-model="fwzt"
             label="房屋状态"
             placeholder="请选择"
-            @click="showPicker = true"
+            @click="showfwzt = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
           />
-          <van-popup v-model="showPicker" position="bottom">
+          <van-popup v-model="showfwzt" position="bottom">
             <van-picker
               show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
+              :columns="fwztDictionaries"
+              @confirm="onConfirmFwzt"
+              @cancel="showfwzt = false"
             />
           </van-popup>
           <van-field
             readonly
             clickable
             name="picker"
-            :value="value"
+            v-model="fwaqxjddj"
             label="房屋安全性鉴定等级"
             placeholder="请选择"
-            @click="showPicker = true"
+            @click="showfwaqxjddj = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
           />
-          <van-popup v-model="showPicker" position="bottom">
+          <van-popup v-model="showfwaqxjddj" position="bottom">
             <van-picker
               show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
+              :columns="fwaqxjddjDictionaries"
+              @confirm="onConfirmFwaqxjddj"
+              @cancel="showfwaqxjddj = false"
             />
           </van-popup>
           <van-field
             readonly
             clickable
             name="picker"
-            :value="value"
+            v-model="lyzk"
             label="利用状况"
             placeholder="请选择"
-            @click="showPicker = true"
+            @click="showlyzk = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
           />
-          <van-popup v-model="showPicker" position="bottom">
+          <van-popup v-model="showlyzk" position="bottom">
             <van-picker
               show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
+              :columns="lyzkDictionaries"
+              @confirm="onConfirmLyzk"
+              @cancel="showlyzk = false"
             />
           </van-popup>
           <van-field
             readonly
             clickable
             name="picker"
-            :value="value"
+            v-model="fwsfxz"
             label="房屋是否闲置"
             placeholder="请选择"
-            @click="showPicker = true"
+            @click="showfwsfxz = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
           />
-          <van-popup v-model="showPicker" position="bottom">
+          <van-popup v-model="showfwsfxz" position="bottom">
             <van-picker
               show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
+              :columns="fwsfxzDictionaries"
+              @confirm="onConfirmFwsfxz"
+              @cancel="showfwsfxz = false"
             />
           </van-popup>
-          <van-field label="闲置原因" placeholder="闲置原因" input-align="right" label-width="auto"/>
+          <van-field v-model="circulation.fwxzyy" label="闲置原因" placeholder="闲置原因" input-align="right" label-width="auto"/>
           <van-field
             readonly
             clickable
             name="picker"
-            :value="value"
+            v-model="circulation.fwxzqssj"
             label="房屋闲置起始时间"
             placeholder="房屋闲置起始时间"
-            @click="showPicker1 = true"
+            @click="showfwxzqssj = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
           />
-          <van-popup v-model="showPicker1" position="bottom">
+          <van-popup v-model="showfwxzqssj" position="bottom">
             <van-datetime-picker
               v-model="currentDate"
               type="date"
               title="选择年月日"
               :min-date="minDate"
               :max-date="maxDate"
+              @confirm="onConfirmFwxzqssj"
             />
           </van-popup>
           <van-field
             readonly
             clickable
             name="picker"
-            :value="value"
-            label="盘或利用模式"
+            v-model="phlyms"
+            label="盘活利用模式"
             placeholder="请选择"
-            @click="showPicker = true"
+            @click="showphlyms = true"
             input-align="right"
             right-icon="arrow-down"
             label-width="auto"
           />
-          <van-popup v-model="showPicker" position="bottom">
+          <van-popup v-model="showphlyms" position="bottom">
             <van-picker
               show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
+              :columns="phlymsDictionaries"
+              @confirm="onConfirmPhlyms"
+              @cancel="showphlyms = false"
             />
           </van-popup>
           <van-field
             readonly
             clickable
             name="picker"
-            :value="value"
+            v-model="circulation.dcsj"
             label="调查时间"
             placeholder="选择调查时间"
-            @click="showPicker1 = true"
+            @click="showdcsj = true"
             input-align="right"
             right-icon="arrow-down"
           />
-          <van-popup v-model="showPicker1" position="bottom">
+          <van-popup v-model="showdcsj" position="bottom">
             <van-datetime-picker
               v-model="currentDate"
               type="date"
               title="选择年月日"
               :min-date="minDate"
               :max-date="maxDate"
+              @confirm="onConfirmDcsj"
             />
           </van-popup>
-          <van-field label="年收益" placeholder="年收益" input-align="right" label-width="auto"/>
+          <van-field v-model="circulation.nsy" label="年收益" placeholder="年收益" input-align="right" label-width="auto"/>
         </div>
 
         <p class="main_title">照片信息</p>
@@ -202,7 +203,7 @@
 
         <p class="main_title">补偿信息</p>
         <div class="main_box">
-          <van-field label="备注" type="textarea" placeholder="请输入内容" input-align="right" label-width="auto"/>
+          <van-field v-model="circulation.bz" label="备注" type="textarea" placeholder="请输入内容" input-align="right" label-width="auto"/>
         </div>
 
         <div style="padding: 16px 0;">
@@ -211,39 +212,140 @@
               <van-button type="info" color="#B4B0B0" native-type="submit" class="submitButton">关闭</van-button>
             </van-col>
             <van-col span="12" align="center">
-              <van-button type="info" native-type="submit" class="submitButton">保存</van-button>
+              <van-button type="info" native-type="submit" class="submitButton" @click="goSubmit">保存</van-button>
             </van-col>
           </van-row>
           <div class="clear"></div>
         </div>
-
-      </van-form>
     </div>
 </template>
 
 <script>
+import { nmfwlyAdd } from "@/api/onlineHome/homestead/utilization";
+import { zjdzd } from "@/api/onlineHome/homestead/circulation";
 export default {
     name: "circulationAdd",
   data() {
     return {
-      value: '',
-      columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
-      showPicker: false,
-      showPicker1: false,
       minDate: new Date(2020, 0, 1),
       maxDate: new Date(2025, 10, 1),
       currentDate: new Date(2021, 0, 17),
-      findList:[]
+      findList:[],
+
+      phlyms : '',
+      fwsfxz : '',
+      lyzk : '',
+      fwaqxjddj : '',
+      fwzt: '',
+
+      showzjddm:false,
+      showphlyms:false,
+      showfwsfxz:false,
+      showlyzk:false,
+      showfwaqxjddj:false,
+      showfwzt:false,
+      showdcsj: false,
+      showfwxzqssj: false,
+
+      phlymsDictionaries: [],
+      fwsfxzDictionaries: [],
+      lyzkDictionaries: [],
+      fwaqxjddjDictionaries: [],
+      fwztDictionaries: [],
+      zjdDictionaries: [],
+
+      circulation: {}
     };
   },
   created() {
-
+    this.getDetail()
   },
   methods: {
-    onConfirm(value) {
-      this.value = value;
-      this.showPicker = false;
+    getDetail(){
+      //退出权利类型
+      this.houseGetDicts("fwzt").then((res) => {
+        for(var i = 0 ; i < res.data.length ; i++){
+          this.fwztDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+        }
+      });
+      this.houseGetDicts("fwaqxjddj").then((res) => {
+        for(var i = 0 ; i < res.data.length ; i++){
+          this.fwaqxjddjDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+        }
+      });
+      this.houseGetDicts("nmfwlyzk").then((res) => {
+        for(var i = 0 ; i < res.data.length ; i++){
+          this.lyzkDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+        }
+      });
+      this.houseGetDicts("sys_yes_no").then((res) => {
+        for(var i = 0 ; i < res.data.length ; i++){
+          this.fwsfxzDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+        }
+      });
+      this.houseGetDicts("phlyms").then((res) => {
+        for(var i = 0 ; i < res.data.length ; i++){
+          this.phlymsDictionaries.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);
+        }
+      });
+    },
+    onConfirmZjddm(data){
+      console.log(data)
+      this.circulation.nmfwdm = data;
+      this.showzjddm = false;
+    },
+    onConfirmPhlyms(data){
+      this.phlyms = data.text;
+      this.circulation.phlyms = data.value;
+      this.showphlyms = false;
     },
+    onConfirmFwsfxz(data){
+      this.fwsfxz = data.text;
+      this.circulation.fwsfxz = data.value;
+      this.showfwsfxz = false;
+    },
+    onConfirmLyzk(data){
+      this.lyzk = data.text;
+      this.circulation.lyzk = data.value;
+      this.showlyzk = false;
+    },
+    onConfirmFwaqxjddj(data){
+      this.fwaqxjddj = data.text;
+      this.circulation.fwaqxjddj = data.value;
+      this.showfwaqxjddj = false;
+    },
+    onConfirmFwzt(data){
+      this.fwzt = data.text;
+      this.circulation.fwzt = data.value;
+      this.showfwzt = false;
+    },
+    onConfirmFwxzqssj(data){
+      this.circulation.fwxzqssj = this.getNowFormatDate(data).substr(0,10);;
+      this.showfwxzqssj = false;
+    },
+    onConfirmFwxzqssj(data){
+      this.circulation.fwxzqssj = this.getNowFormatDate(data).substr(0,10);;
+      this.showfwxzqssj = false;
+    },
+    onConfirmDcsj(data){
+      this.circulation.dcsj = this.getNowFormatDate(data).substr(0,10);;
+      this.showdcsj = false;
+    },
+    goSubmit(){
+      console.log(this.circulation)
+      nmfwlyAdd(this.circulation).then(response => {
+        if(response.code = 200){
+          this.$toast.success('保存成功');
+        }
+      });
+    }
+
   },
 }
 </script>
diff --git a/src/views/onlineHome/homestead/utilization/utilizationDetail.vue b/src/views/onlineHome/homestead/utilization/utilizationDetail.vue
new file mode 100644
index 00000000..f6ae1870
--- /dev/null
+++ b/src/views/onlineHome/homestead/utilization/utilizationDetail.vue
@@ -0,0 +1,121 @@
+<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.nmfwdm" label="农民房屋代码" input-align="right" label-width="auto" />
+      <van-field readonly v-model="circulation.fwzt" label="房屋状态" input-align="right" label-width="auto" />
+      <van-field readonly v-model="circulation.fwaqxjddj" label="房屋安全性鉴定等级" input-align="right" label-width="auto" />
+      <van-field readonly v-model="circulation.nmfwlyzk" label="利用状况" input-align="right" label-width="auto" />
+      <van-field readonly v-model="circulation.fwsfxz" label="房屋是否闲置" input-align="right" label-width="auto" />
+      <van-field readonly v-model="circulation.fwxzyy" label="闲置原因" input-align="right" label-width="auto"/>
+      <van-field readonly v-model="circulation.fwxzqssj" label="房屋闲置起始时间" input-align="right" label-width="auto" />
+      <van-field readonly v-model="circulation.phlyms" label="盘或利用模式" input-align="right" label-width="auto" />
+      <van-field readonly v-model="circulation.dcsj" label="调查时间" input-align="right" label-width="auto" />
+      <van-field readonly v-model="circulation.nsy" label="年收益" input-align="right" label-width="auto" />
+    </div>
+
+    <p class="main_title">照片信息</p>
+    <div class="main_box" style="padding: 5%;">
+      <van-row>
+        <van-col span="12">
+          <p style="margin-bottom: 5%;color: #333333;font-size: 14px;">现场照片东</p>
+          <van-uploader v-model="findList" multiple />
+        </van-col>
+        <van-col span="12">
+          <p style="margin-bottom: 5%;color: #333333;font-size: 14px;">现场照片南</p>
+          <van-uploader v-model="findList" multiple />
+        </van-col>
+      </van-row>
+      <van-row>
+        <van-col span="12">
+          <p style="margin-bottom: 5%;color: #333333;font-size: 14px;">现场照片西</p>
+          <van-uploader v-model="findList" multiple />
+        </van-col>
+        <van-col span="12">
+          <p style="margin-bottom: 5%;color: #333333;font-size: 14px;">现场照片北</p>
+          <van-uploader v-model="findList" multiple />
+        </van-col>
+      </van-row>
+    </div>
+
+    <p class="main_title">补偿信息</p>
+    <div class="main_box">
+      <van-field readonly v-model="circulation.bz" label="备注" type="textarea" input-align="right" label-width="auto"/>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { getZjdly } from "@/api/onlineHome/homestead/utilization";
+  export default {
+    name: "utilizationDetail",
+    data() {
+      return {
+        findList:[],
+        circulation:[]
+      };
+    },
+    created() {
+      this.getDetail();
+    },
+    methods: {
+      getDetail(){
+        getZjdly(this.$route.query.id).then(response => {
+          console.log(response)
+          //退出权利类型
+          this.houseGetDicts("fwzt").then((res) => {
+            this.circulation.fwzt = this.selectDictLabel(res.data, response.data.fwzt);
+          });
+          this.houseGetDicts("fwaqxjddj").then((res) => {
+            this.circulation.fwaqxjddj = this.selectDictLabel(res.data, response.data.fwaqxjddj);
+          });
+          this.houseGetDicts("nmfwlyzk").then((res) => {
+            this.circulation.nmfwlyzk = this.selectDictLabel(res.data, response.data.lyzk);
+          });
+          this.houseGetDicts("sys_yes_no").then((res) => {
+            this.circulation.fwsfxz = this.selectDictLabel(res.data, response.data.fwsfxz);
+          });
+          this.houseGetDicts("phlyms").then((res) => {
+            this.circulation.phlyms = this.selectDictLabel(res.data, response.data.phlyms);
+          });
+          this.circulation = response.data;
+        });
+      }
+    },
+  }
+</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/utilization/utilizationList.vue b/src/views/onlineHome/homestead/utilization/utilizationList.vue
index 3bba7ca3..6bebf5e9 100644
--- a/src/views/onlineHome/homestead/utilization/utilizationList.vue
+++ b/src/views/onlineHome/homestead/utilization/utilizationList.vue
@@ -5,6 +5,7 @@
         fixed
         placeholder
         @click-left="$router.back(-1)"
+        @click-right="goAdd"
       >
         <template #title>
           <p style="font-weight: bold;">农房利用情况</p>
@@ -13,42 +14,104 @@
           <van-icon name="add" size="18" />
         </template>
       </van-nav-bar>
-      <van-swipe-cell v-for="(item,index) in 10">
-        <van-cell title="440604100202000000Z00012" center >
-          <template #icon>
-            <van-icon name="../../../static/images/icon/icon_ly.png" size="22" color="#539FFD" style="margin-right: 10px;" />
-          </template>
-          <template #label>
-            <p><b style="color: #7DDA4F;">正常</b><i style="margin-right: 0.5rem;"></i><b style="color: #333333;">自住</b><i style="margin-right: 0.5rem;"></i>闲置<span style="float: right">2021-08-14</span></p>
+      <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.nmfwdm" center :to="{name:'utilizationDetail', query: {id:item.id}}" >
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_ly.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><b style="color: #7DDA4F;">{{item.lyzk}}</b><i style="margin-right: 0.5rem;"></i>{{item.fwzt}}<span style="float: right">{{item.dcsj}}</span></p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button square text="修改" :to="{name:'utilizationModify', query: {id:item.id}}" type="info" class="delete-button" />
+              </van-col>
+              <van-col>
+                <van-button square text="删除" type="danger" class="delete-button"  @click="deleteList(item.id,index)" />
+              </van-col>
+            </van-row>
           </template>
-        </van-cell>
-        <template #right>
-          <van-row>
-            <van-col>
-              <van-button square text="修改" type="info" class="delete-button" />
-            </van-col>
-            <van-col>
-              <van-button square text="删除" type="danger" class="delete-button" />
-            </van-col>
-          </van-row>
-        </template>
-      </van-swipe-cell>
+        </van-swipe-cell>
+      </van-list>
     </div>
 </template>
 
 <script>
+import { getList , nmfwlyRemove } from "@/api/onlineHome/homestead/utilization";
 export default {
-    name: "paidExit",
+  name: "utilizationList",
   data() {
     return {
-
+      applicationList:[],
+      zjdlyzkStatus:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        orderByColumn:'createTime',
+        isAsc:'desc'
+      }
     };
   },
   created() {
-
+    this.houseGetDicts("nmfwlyzk").then((res) => {
+      console.log(res)
+      this.zjdlyzkStatus = res.data;
+    });
+    this.houseGetDicts("fwzt").then((res) => {
+      console.log(res)
+      this.fwztStatus = res.data;
+    });
   },
   methods: {
-
+    goAdd(){
+      window.location = 'utilizationAdd';
+    },
+    getList(){
+      setTimeout(() => {
+        getList(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            response.rows[i].lyzk = this.selectDictLabel(this.zjdlyzkStatus, response.rows[i].lyzk)
+            response.rows[i].fwzt = this.selectDictLabel(this.fwztStatus, response.rows[i].fwzt)
+            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)
+        nmfwlyRemove(id).then(res => {
+          if(res.code = 200){
+            this.$toast.success('删除成功');
+          }
+        });
+      })
+      .catch(() => {
+        // on cancel
+      });
+    }
   },
 }
 </script>
diff --git a/src/views/onlineHome/homestead/utilization/utilizationModify.vue b/src/views/onlineHome/homestead/utilization/utilizationModify.vue
new file mode 100644
index 00000000..6316a838
--- /dev/null
+++ b/src/views/onlineHome/homestead/utilization/utilizationModify.vue
@@ -0,0 +1,444 @@
+<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
+          name="picker"
+          v-model="circulation.nmfwdm"
+          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
+          readonly
+          clickable
+          name="picker"
+          v-model="fwzt"
+          label="房屋状态"
+          placeholder="请选择"
+          @click="showfwzt = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showfwzt" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="fwztDictionaries"
+            @confirm="onConfirmFwzt"
+            @cancel="showfwzt = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          name="picker"
+          v-model="fwaqxjddj"
+          label="房屋安全性鉴定等级"
+          placeholder="请选择"
+          @click="showfwaqxjddj = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showfwaqxjddj" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="fwaqxjddjDictionaries"
+            @confirm="onConfirmFwaqxjddj"
+            @cancel="showfwaqxjddj = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          name="picker"
+          v-model="lyzk"
+          label="利用状况"
+          placeholder="请选择"
+          @click="showlyzk = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showlyzk" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="lyzkDictionaries"
+            @confirm="onConfirmLyzk"
+            @cancel="showlyzk = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          name="picker"
+          v-model="fwsfxz"
+          label="房屋是否闲置"
+          placeholder="请选择"
+          @click="showfwsfxz = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showfwsfxz" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="fwsfxzDictionaries"
+            @confirm="onConfirmFwsfxz"
+            @cancel="showfwsfxz = false"
+          />
+        </van-popup>
+        <van-field v-model="circulation.fwxzyy" label="闲置原因" placeholder="闲置原因" input-align="right" label-width="auto"/>
+        <van-field
+          readonly
+          clickable
+          name="picker"
+          v-model="circulation.fwxzqssj"
+          label="房屋闲置起始时间"
+          placeholder="房屋闲置起始时间"
+          @click="showfwxzqssj = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showfwxzqssj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmFwxzqssj"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          name="picker"
+          v-model="phlyms"
+          label="盘活利用模式"
+          placeholder="请选择"
+          @click="showphlyms = true"
+          input-align="right"
+          right-icon="arrow-down"
+          label-width="auto"
+        />
+        <van-popup v-model="showphlyms" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="phlymsDictionaries"
+            @confirm="onConfirmPhlyms"
+            @cancel="showphlyms = false"
+          />
+        </van-popup>
+        <van-field
+          readonly
+          clickable
+          name="picker"
+          v-model="circulation.dcsj"
+          label="调查时间"
+          placeholder="选择调查时间"
+          @click="showdcsj = true"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+        <van-popup v-model="showdcsj" position="bottom">
+          <van-datetime-picker
+            v-model="currentDate"
+            type="date"
+            title="选择年月日"
+            :min-date="minDate"
+            :max-date="maxDate"
+            @confirm="onConfirmDcsj"
+          />
+        </van-popup>
+        <van-field v-model="circulation.nsy" label="年收益" placeholder="年收益" input-align="right" label-width="auto"/>
+      </div>
+
+      <p class="main_title">照片信息</p>
+      <div class="main_box" style="padding: 5%;">
+        <van-row>
+          <van-col span="12">
+            <p style="margin-bottom: 5%;color: #333333;font-size: 14px;">现场照片东</p>
+            <van-uploader v-model="findListD" max-count="1"/>
+          </van-col>
+          <van-col span="12">
+            <p style="margin-bottom: 5%;color: #333333;font-size: 14px;">现场照片南</p>
+            <van-uploader v-model="findListN" max-count="1" />
+          </van-col>
+        </van-row>
+        <van-row>
+          <van-col span="12">
+            <p style="margin-bottom: 5%;color: #333333;font-size: 14px;">现场照片西</p>
+            <van-uploader v-model="findListX" max-count="1" />
+          </van-col>
+          <van-col span="12">
+            <p style="margin-bottom: 5%;color: #333333;font-size: 14px;">现场照片北</p>
+            <van-uploader v-model="findListB" max-count="1" />
+          </van-col>
+        </van-row>
+      </div>
+
+      <p class="main_title">补偿信息</p>
+      <div class="main_box">
+        <van-field v-model="circulation.bz" label="备注" type="textarea" 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">关闭</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 { getZjdly , nmfwlyEdit , upload} from "@/api/onlineHome/homestead/utilization";
+export default {
+    name: "utilizationModify",
+  data() {
+    return {
+      minDate: new Date(),
+      maxDate: new Date(2025, 10, 1),
+      currentDate: new Date(),
+      findListD:[],
+      findListN:[],
+      findListX:[],
+      findListB:[],
+
+      phlyms : '',
+      fwsfxz : '',
+      lyzk : '',
+      fwaqxjddj : '',
+      fwzt: '',
+
+      showzjddm:false,
+      showphlyms:false,
+      showfwsfxz:false,
+      showlyzk:false,
+      showfwaqxjddj:false,
+      showfwzt:false,
+      showdcsj: false,
+      showfwxzqssj: false,
+
+      phlymsDictionaries: [],
+      fwsfxzDictionaries: [],
+      lyzkDictionaries: [],
+      fwaqxjddjDictionaries: [],
+      fwztDictionaries: [],
+      zjdDictionaries: [],
+
+      circulation: {}
+    };
+  },
+  created() {
+    this.getDetail();
+  },
+  methods: {
+    getDetail(){
+      getZjdly(this.$route.query.id).then(response => {
+        console.log(response)
+        //退出权利类型
+        this.houseGetDicts("fwzt").then((res) => {
+          for(var i = 0 ; i < res.data.length ; i++){
+            this.fwztDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+          }
+          this.fwzt = this.selectDictLabel(res.data, response.data.fwzt);
+        });
+        this.houseGetDicts("fwaqxjddj").then((res) => {
+          for(var i = 0 ; i < res.data.length ; i++){
+            this.fwaqxjddjDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+          }
+          this.fwaqxjddj = this.selectDictLabel(res.data, response.data.fwaqxjddj);
+        });
+        this.houseGetDicts("nmfwlyzk").then((res) => {
+          for(var i = 0 ; i < res.data.length ; i++){
+            this.lyzkDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+          }
+          this.lyzk = this.selectDictLabel(res.data, response.data.lyzk);
+        });
+        this.houseGetDicts("sys_yes_no").then((res) => {
+          for(var i = 0 ; i < res.data.length ; i++){
+            this.fwsfxzDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+          }
+          this.fwsfxz = this.selectDictLabel(res.data, response.data.fwsfxz);
+        });
+        this.houseGetDicts("phlyms").then((res) => {
+          for(var i = 0 ; i < res.data.length ; i++){
+            this.phlymsDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue});
+          }
+          this.phlyms = this.selectDictLabel(res.data, response.data.phlyms);
+        });
+        //宅基地代码
+        zjdzd().then(zjdRes => {
+          for( let i = 0 ; i < zjdRes.rows.length ; i++){
+            this.zjdDictionaries.push(zjdRes.rows[i].zjddm);
+          }
+        });
+        this.circulation = response.data;
+        if(response.data.xczpd != null){this.findListD.push({url:'http://192.168.31.26:8080'+ response.data.xczpd, isImage: true});}
+        if(response.data.xczpx != null){this.findListX.push({url:'http://192.168.31.26:8080'+ response.data.xczpx, isImage: true});}
+        if(response.data.xczpn != null){this.findListN.push({url:'http://192.168.31.26:8080'+ response.data.xczpn, isImage: true});}
+        if(response.data.xczpb != null){this.findListB.push({url:'http://192.168.31.26:8080'+ response.data.xczpb, isImage: true});}
+
+      });
+    },
+    onConfirmZjddm(data){
+      console.log(data)
+      this.circulation.nmfwdm = data;
+      this.showzjddm = false;
+    },
+    onConfirmPhlyms(data){
+      this.phlyms = data.text;
+      this.circulation.phlyms = data.value;
+      this.showphlyms = false;
+    },
+    onConfirmFwsfxz(data){
+      this.fwsfxz = data.text;
+      this.circulation.fwsfxz = data.value;
+      this.showfwsfxz = false;
+    },
+    onConfirmLyzk(data){
+      this.lyzk = data.text;
+      this.circulation.lyzk = data.value;
+      this.showlyzk = false;
+    },
+    onConfirmFwaqxjddj(data){
+      this.fwaqxjddj = data.text;
+      this.circulation.fwaqxjddj = data.value;
+      this.showfwaqxjddj = false;
+    },
+    onConfirmFwzt(data){
+      this.fwzt = data.text;
+      this.circulation.fwzt = data.value;
+      this.showfwzt = false;
+    },
+    onConfirmFwxzqssj(data){
+      this.circulation.fwxzqssj = this.getNowFormatDate(data).substr(0,10);;
+      this.showfwxzqssj = false;
+    },
+    onConfirmFwxzqssj(data){
+      this.circulation.fwxzqssj = this.getNowFormatDate(data).substr(0,10);;
+      this.showfwxzqssj = false;
+    },
+    onConfirmDcsj(data){
+      this.circulation.dcsj = this.getNowFormatDate(data).substr(0,10);;
+      this.showdcsj = false;
+    },
+    base64toFile(dataurl, filename = "file") {
+      let arr = dataurl.split(",");
+      let mime = arr[0].match(/:(.*?);/)[1];
+      let suffix = mime.split("/")[1];
+      let bstr = atob(arr[1]);
+      let n = bstr.length;
+      let u8arr = new Uint8Array(n);
+      while (n--) {
+        u8arr[n] = bstr.charCodeAt(n);
+      }
+      return new File([u8arr], `${filename}.${suffix}`, {
+        type: mime,
+      });
+    },
+    goSubmit(){
+      console.log(this.findListD)
+      console.log(this.findListD.indexOf('http'))
+      if(this.findListD != '' && this.findListD[0].content != undefined){
+        console.log('1111')
+        const params = new FormData()
+        params.append('file', this.base64toFile(this.findListD[0].content))
+        upload(params).then(res => {
+          this.circulation.xczpd = res.fileName;
+        });
+      }
+      if(this.findListX != '' && this.findListX[0].content != undefined){
+        console.log('2222')
+        const params = new FormData()
+        params.append('file', this.base64toFile(this.findListX[0].content))
+        upload(params).then(res => {
+          this.circulation.xczpx = res.fileName;
+        });
+      }
+      if( this.findListN != '' && this.findListN[0].content != undefined){
+        console.log('3333')
+        const params = new FormData()
+        params.append('file', this.base64toFile(this.findListN[0].content))
+        upload(params).then(res => {
+          this.circulation.xczpn = res.fileName;
+        });
+      }
+      if( this.findListB != '' && this.findListB[0].content != undefined){
+        console.log('4444')
+        const params = new FormData()
+        params.append('file', this.base64toFile(this.findListB[0].content))
+        upload(params).then(res => {
+          this.circulation.xczpb = res.fileName;
+        });
+      }
+      var that = this ;
+      setTimeout(function(){
+        console.log(that.circulation);
+        nmfwlyEdit(that.circulation).then(response => {
+          if(response.code = 200){
+            that.$toast.success('保存成功');
+          }
+        });
+      },2000);
+    }
+  },
+}
+</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 50cba671..69463234 100644
--- a/src/views/onlineHome/workbench.vue
+++ b/src/views/onlineHome/workbench.vue
@@ -280,6 +280,77 @@
           </van-grid-item>
         </van-grid>
       </van-row>
+      <van-row  style="margin:2%;width:96%;padding:20px 0;padding:20px 0;border-radius: 6px;box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);background: #fff">
+        <van-cell style="border-radius: 6px;">
+          <template #title>
+            <p style="font-weight: bold;font-size: 18px;display: inline-block">农村宅基地审批管理</p>
+          </template>
+        </van-cell>
+        <van-grid :gutter="10" :border="false">
+          <van-grid-item text="宅基地申请" :to="{name:'applicationList'}" >
+            <div slot="default" style="background:#FF4646;padding: 10px;text-align:center;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px" >
+              <img src="../../../static/images/onlineHome/icon6.png" style="width: 25px;" alt />
+            </div>
+            <p style="margin-top: 5px;color: #666666;">宅基地申请</p>
+          </van-grid-item>
+          <van-grid-item text="使用权流转" :to="{name:'circulationList'}" >
+            <div slot="default">
+              <div style="background:#FF6464;padding: 10px;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px">
+                <img src="../../../static/images/onlineHome/icon11.png" style="width: 25px" alt />
+              </div>
+            </div>
+            <p style="margin-top: 5px;color: #666666;">使用权流转</p>
+          </van-grid-item>
+          <van-grid-item text="有偿退出" :to="{name:'paidExit'}" >
+            <div slot="default">
+              <div style="background:#539FFD;padding: 10px;border-radius: 10px;box-sizing: border-box;width: 44px;height: 44px ">
+                <img src="../../../static/images/onlineHome/icon12.png" style="width: 25px;" alt />
+              </div>
+            </div>
+            <p style="margin-top: 5px;color: #666666;">有偿退出</p>
+          </van-grid-item>
+          <van-grid-item text="使用权抵押" :to="{name:'mortgage'}" >
+            <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/icon13.png" style="width: 25px" alt />
+              </div>
+            </div>
+            <p style="margin-top: 5px;color: #666666;">使用权抵押</p>
+          </van-grid-item>
+          <van-grid-item text="农房利用" :to="{name:'utilization'}" >
+            <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/icon13.png" style="width: 25px" alt />
+              </div>
+            </div>
+            <p style="margin-top: 5px;color: #666666;">农房利用</p>
+          </van-grid-item>
+          <van-grid-item text="宅基地利用" :to="{name:'homesteadUtilize'}" >
+            <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/icon13.png" style="width: 25px" alt />
+              </div>
+            </div>
+            <p style="margin-top: 5px;color: #666666;">宅基地利用</p>
+          </van-grid-item>
+          <van-grid-item text="证书查看" :to="{name:'certificateList'}" >
+            <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/icon13.png" style="width: 25px" alt />
+              </div>
+            </div>
+            <p style="margin-top: 5px;color: #666666;">证书查看</p>
+          </van-grid-item>
+          <van-grid-item text="公示信息" :to="{name:'informationList'}" >
+            <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/icon13.png" style="width: 25px" alt />
+              </div>
+            </div>
+            <p style="margin-top: 5px;color: #666666;">公示信息</p>
+          </van-grid-item>
+        </van-grid>
+      </van-row>
       <onlineHomeIndex></onlineHomeIndex>
     </div>
 </template>