宅基地接口对接（使用权流转列表 添加 删除 新增）

src/api/onlineHome/homestead/circulation.js

@@ -0,0 +1,69 @@
+import request from '@/utils/request'
+
+//查询列表
+export function getList(data){
+  return request({
+    url:'/house/mobile/lz/list',
+    method:'get',
+    params:data
+  })
+}
+
+//删除列表项
+export function removeList(id){
+  return request({
+    url:'/house/lz/remove/'+id,
+    method:'get'
+  })
+}
+
+//宅基地流转详情
+export function getLz(id){
+  return request({
+    url:'/house/lz/get/'+id,
+    method:'get'
+  })
+}
+
+//宅基地代码
+export function zjdzd(){
+  return request({
+    url:'/house/mobile/zjdzd/list',
+    method:'get'
+  })
+}
+
+//权利人代码
+export function getByZjddm(data){
+  return request({
+    url:'/house/obligee/getByZjddm',
+    method:'get',
+    params:data
+  })
+}
+
+//修改保存宅基地流转
+export function edit(data){
+  return request({
+    url:'/house/lz/edit',
+    method:'post',
+    data:data
+  })
+}
+
+//修改保存宅基地流转
+export function goApply(id){
+  return request({
+    url:'/house/lz/submitApply/'+id,
+    method:'post',
+  })
+}
+
+//修改保存宅基地流转
+export function houseAdd(data){
+  return request({
+    url:'/house/lz/add',
+    method:'post',
+    data:data
+  })
+}

src/router/index.js

@@ -734,6 +734,24 @@ export const constantRoutes = [
       hidden: true,
     },
     component: (resolve) => require(['@/views/onlineHome/homestead/homesteadUtilize/homesteadUtilizeAdd'], resolve)
+  },
+  {
+    path: '/circulationDetail',
+    name: 'circulationDetail',
+    meta: {
+      title: '查看宅基地使用流转权',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/circulation/circulationDetail'], resolve)
+  },
+  {
+    path: '/circulationModify',
+    name: 'circulationModify',
+    meta: {
+      title: '修改宅基地使用流转权',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/onlineHome/homestead/circulation/circulationModify'], resolve)
   }
 ];
 

src/utils/utils.js

@@ -45,6 +45,6 @@ export function getNowFormatDate(time) {
     seconds = "0" + seconds;
   }
   var currentdate = date.getFullYear() + seperator1 + month + seperator1 + day + " " + hours + seperator2 + minutes + seperator2 + seconds;
-  console.log(currentdate)
+
   return currentdate;
 }

src/views/onlineHome/homestead/circulation/circulationAdd.vue

@@ -1,280 +1,381 @@
 <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>
-      <van-form @submit="onSubmit">
-        <p class="main_title">转出方信息</p>
-        <div class="main_box">
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="宅基地代码"
-            placeholder="请选择"
-            @click="showPicker = true"
-            input-align="right"
-            right-icon="arrow-down"
-          />
-          <van-popup v-model="showPicker" position="bottom">
-            <van-picker
-              show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
-            />
-          </van-popup>
+  <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>
+    <p class="main_title">转出方信息</p>
+    <div class="main_box">
+      <van-field
+        readonly
+        clickable
+        v-model="circulation.zjddm"
+        label="宅基地代码"
+        placeholder="请选择"
+        @click="showZjd = true"
+        input-align="right"
+        right-icon="arrow-down"
+      />
+      <van-popup v-model="showZjd" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="zjdDictionaries"
+          @confirm="onConfirmZjd"
+          @cancel="showZjd = false"
+        />
+      </van-popup>
 
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="流转方式"
-            placeholder="请选择"
-            @click="showPicker = true"
-            input-align="right"
-            right-icon="arrow-down"
-          />
-          <van-popup v-model="showPicker" position="bottom">
-            <van-picker
-              show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
-            />
-          </van-popup>
+      <van-field
+        readonly
+        clickable
+        v-model="lzfs"
+        label="流转方式"
+        placeholder="请选择"
+        @click="showLzfs = true"
+        input-align="right"
+        right-icon="arrow-down"
+      />
+      <van-popup v-model="showLzfs" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="lzfsDictionaries"
+          @confirm="onConfirmLzfs"
+          @cancel="showLzfs = false"
+        />
+      </van-popup>
 
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="转出方使用权人代码"
-            placeholder="请选择"
-            @click="showPicker = true"
-            label-width="auto"
-            input-align="right"
-            right-icon="arrow-down"
-          />
-          <van-popup v-model="showPicker" position="bottom">
-            <van-picker
-              show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
-            />
-          </van-popup>
+      <van-field
+        v-model="circulation.shyqrdm"
+        label="转出方使用权人代码"
+        placeholder="请选择"
+        label-width="auto"
+        input-align="right"
+      />
+      <!--          @click="showShyqrdm = true"-->
+      <!--          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-cell title="是否本集体经济组织成员">
-            <template #right-icon>
-              <van-radio-group v-model="radio" direction="horizontal">
-                <van-radio name="1">是</van-radio>
-                <van-radio name="2">否</van-radio>
-              </van-radio-group>
-            </template>
-          </van-cell>
-        </div>
+      <van-cell title="是否本集体经济组织成员">
+        <template #right-icon>
+          <van-radio-group v-model="circulation.zcfsfbjtjjzzcy" direction="horizontal">
+            <van-radio name="Y">是</van-radio>
+            <van-radio name="N">否</van-radio>
+          </van-radio-group>
+        </template>
+      </van-cell>
+    </div>
 
-        <p class="main_title">流转信息</p>
-        <div class="main_box">
-          <van-field label="流转面积(㎡)" placeholder="请输入流转面积(㎡)" input-align="right" label-width="auto"/>
-          <van-field label="流转单价(元)" placeholder="请输入流转单价(元)" input-align="right" label-width="auto"/>
-          <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"
-          />
-          <van-popup v-model="showPicker1" position="bottom">
-            <van-datetime-picker
-              v-model="currentDate"
-              type="date"
-              title="选择年月日"
-              :min-date="minDate"
-              :max-date="maxDate"
-            />
-          </van-popup>
+    <p class="main_title">流转信息</p>
+    <div class="main_box">
+      <van-field label="流转面积(㎡)" v-model="circulation.lzmj" placeholder="请输入流转面积(㎡)" input-align="right" label-width="auto"/>
+      <van-field label="流转单价(元)" v-model="circulation.lzdj" placeholder="请输入流转单价(元)" input-align="right" label-width="auto"/>
+      <van-field label="流转费用(元)" v-model="circulation.lzfy" placeholder="请输入流转费用(元)" input-align="right" label-width="auto"/>
+      <van-field
+        readonly
+        clickable
+        v-model="circulation.lzqsrq"
+        label="流转起始时间"
+        placeholder="请选择起始时间"
+        @click="showlzqsrq = true"
+        input-align="right"
+        right-icon="arrow-down"
+      />
+      <van-popup v-model="showlzqsrq" position="bottom">
+        <van-datetime-picker
+          v-model="currentDate"
+          type="date"
+          title="选择年月日"
+          :min-date="minDate"
+          :max-date="maxDate"
+          @confirm="onConfirmLzqsrq"
+        />
+      </van-popup>
 
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="流转结束时间"
-            placeholder="请选择结束时间"
-            @click="showPicker1 = true"
-            input-align="right"
-            right-icon="arrow-down"
-          />
-          <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
+        v-model="circulation.lzjsrq"
+        label="流转结束时间"
+        placeholder="请选择结束时间"
+        @click="showlzjsrq = true"
+        input-align="right"
+        right-icon="arrow-down"
+      />
+      <van-popup v-model="showlzjsrq" position="bottom">
+        <van-datetime-picker
+          v-model="currentDate"
+          type="date"
+          title="选择年月日"
+          :min-date="minDate"
+          :max-date="maxDate"
+          @confirm="onConfirmLzjsrq"
+        />
+      </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 v-model="showPicker" position="bottom">
-            <van-picker
-              show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
-            />
-          </van-popup>
+      <van-field
+        readonly
+        clickable
+        v-model="lzqfwyt"
+        label="流转前房屋用途"
+        placeholder="请选择流转前房屋用途"
+        @click="showLzqfwyt = true"
+        input-align="right"
+        right-icon="arrow-down"
+        label-width="auto"
+      />
+      <van-popup v-model="showLzqfwyt" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="lzqfwytDictionaries"
+          @confirm="onConfirmLzqfwyt"
+          @cancel="showLzqfwyt = 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 v-model="showPicker" position="bottom">
-            <van-picker
-              show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
-            />
-          </van-popup>
-        </div>
+      <van-field
+        readonly
+        clickable
+        v-model="lzhfwyt"
+        label="流转后房屋用途"
+        placeholder="请选择流转后房屋用途"
+        @click="showLzhfwyt = true"
+        input-align="right"
+        right-icon="arrow-down"
+        label-width="auto"
+      />
+      <van-popup v-model="showLzhfwyt" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="lzhfwytDictionaries"
+          @confirm="onConfirmLzhfwyt"
+          @cancel="showLzhfwyt = false"
+        />
+      </van-popup>
+    </div>
 
-        <p class="main_title">转入方信息</p>
-        <div class="main_box">
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="转入方代表名称"
-            placeholder="请选择"
-            @click="showPicker = true"
-            label-width="auto"
-            input-align="right"
-            right-icon="arrow-down"
-          />
-          <van-popup v-model="showPicker" position="bottom">
-            <van-picker
-              show-toolbar
-              :columns="columns"
-              @confirm="onConfirm"
-              @cancel="showPicker = false"
-            />
-          </van-popup>
+    <p class="main_title">转入方信息</p>
+    <div class="main_box">
+      <van-field
+        v-model="circulation.zrfdbmc"
+        label="转入方代表名称"
+        placeholder="请输入转入方代表名称"
+        label-width="auto"
+        input-align="right"
+      />
+      <!--          <van-popup v-model="showZrfdbmc" position="bottom">-->
+      <!--            <van-picker-->
+      <!--              show-toolbar-->
+      <!--              :columns="zrfdbmcDictionaries"-->
+      <!--              @confirm="onConfirmZrfdbmc"-->
+      <!--              @cancel="showZrfdbmc = false"-->
+      <!--            />-->
+      <!--          </van-popup>-->
 
-          <van-field
-            readonly
-            clickable
-            name="picker"
-            :value="value"
-            label="转入方代表证件类型"
-            placeholder="请选择"
-            @click="showPicker = true"
-            label-width="auto"
-            input-align="right"
-            right-icon="arrow-down"
-          />
-          <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-cell title="是否本集体经济组织成员">
-            <template #right-icon>
-              <van-radio-group v-model="radio" direction="horizontal">
-                <van-radio name="1">是</van-radio>
-                <van-radio name="2">否</van-radio>
-              </van-radio-group>
-            </template>
-          </van-cell>
-        </div>
+      <van-field
+        readonly
+        clickable
+        v-model="zrfdbzjlx"
+        label="转入方代表证件类型"
+        placeholder="请选择"
+        @click="showZrfdbzjlx = true"
+        label-width="auto"
+        input-align="right"
+        right-icon="arrow-down"
+      />
+      <van-popup v-model="showZrfdbzjlx" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="zrfdbzjlxDictionaries"
+          @confirm="onConfirmZrfdbzjlx"
+          @cancel="showZrfdbzjlx = false"
+        />
+      </van-popup>
 
-        <p class="main_title">其他</p>
-        <div class="main_box">
-          <van-field label="所有权人代表姓名" placeholder="请输入姓名" input-align="right" label-width="auto"/>
-          <van-field label="所有权人意见" placeholder="请输入内容" input-align="right" label-width="auto"/>
-          <van-field label="备注" placeholder="请输入备注" input-align="right" label-width="auto"/>
-        </div>
+      <van-field label="转入方代表证件号码" v-model="circulation.zrfdbzjhm" placeholder="请输入证件号码" input-align="right" label-width="auto"/>
+      <van-cell title="是否本集体经济组织成员">
+        <template #right-icon>
+          <van-radio-group  v-model="circulation.zrfsfbjtjjzzcy" direction="horizontal">
+            <van-radio name="Y">是</van-radio>
+            <van-radio name="N">否</van-radio>
+          </van-radio-group>
+        </template>
+      </van-cell>
+    </div>
 
-        <div style="padding: 16px 0;">
-          <van-row>
-            <van-col span="12" align="center">
-              <van-button type="info" 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>
+    <p class="main_title">其他</p>
+    <div class="main_box">
+      <van-field label="所有权人代表姓名" v-model="circulation.suyqrdbxm" placeholder="请输入姓名" input-align="right" label-width="auto"/>
+      <van-field label="所有权人意见" v-model="circulation.suyqryj" placeholder="请输入内容" input-align="right" label-width="auto"/>
+      <van-field label="备注" v-model="circulation.bz" placeholder="请输入备注" input-align="right" label-width="auto"/>
+    </div>
 
-      </van-form>
+    <div style="padding: 16px 0;">
+      <van-row>
+        <van-col span="12" align="center">
+          <van-button type="info" native-type="submit" class="submitButton" @click="goEdit">保<i style="margin-right: 1em;"></i>存</van-button>
+        </van-col>
+        <van-col span="12" align="center">
+          <van-button type="info" native-type="submit" class="submitButton" @click="goSubmit">提<i style="margin-right: 1em;"></i>交</van-button>
+        </van-col>
+      </van-row>
+      <div class="clear"></div>
     </div>
+  </div>
 </template>
 
 <script>
-export default {
+  import { getLz , zjdzd , getByZjddm , edit , goApply,houseAdd } 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),
-    };
-  },
-  created() {
+    data() {
+      return {
+        lzfsDictionaries: [],//流转方式
+        shyqrdmDictionaries: [],//转出方使用权人代码
+        lzqfwytDictionaries: [],//流转前房屋类型
+        lzhfwytDictionaries: [],//流转后房屋类型
+        zrfdbmcDictionaries: [],//转入方代表名称
+        zrfdbzjlxDictionaries: [],//转入方证件类型
+        zjdDictionaries: [],//宅基地列表
+        lzfs: '',//流转方式
+        shyqrdm: '',//转出方使用权人代码
+        lzqfwyt: '',//流转前房屋类型
+        lzhfwyt: '',//流转后房屋类型
+        zrfdbmc: '',//转入方代表名称
+        zrfdbzjlx: '',//转入方证件类型
+        zjd: [],//宅基地列表
+        showLzfs: false,
+        showShyqrdm: false,
+        showLzqfwyt: false,
+        showLzhfwyt: false,
+        showZrfdbmc: false,
+        showZrfdbzjlx: false,
+        showZjd:false,
+        showlzqsrq:false,
+        showlzjsrq:false,
+        minDate: new Date(),
+        maxDate: new Date(2025, 10, 1),
+        currentDate: new Date(),
+        circulation: {}
+      };
+    },
+    created() {
+      this.getDetail();
+    },
+    methods: {
+      getDetail(){
+          //流转方式
+          this.houseGetDicts("lzfs").then((res) => {
+            for( let i = 0 ; i < res.data.length ; i++){
+              this.lzfsDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
+            }
+          });
+          //转入方证件类型
+          this.houseGetDicts("zjlx").then((res) => {
+            for( let i = 0 ; i < res.data.length ; i++){
+              this.zrfdbzjlxDictionaries.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);
+            }
+          });
+          //流转前房屋用途
+          this.houseGetDicts("fwyt").then((res) => {//流转前房屋用途
+            console.log(res)
+            for( let i = 0 ; i < res.data.length ; i++){
+              this.lzqfwytDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
+            }
+          });
+          //流转后房屋用途
+          this.houseGetDicts("fwyt").then((res) => {//流转后房屋用途
+            for( let i = 0 ; i < res.data.length ; i++){
+              this.lzhfwytDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
+            }
+          });
+      },
+      onConfirmLzfs(value) {
+        this.lzfs = value.text;
+        this.circulation.lzfs = value.value;
+        this.showLzfs = false;
+      }, //流转方式
+      onConfirmZjd(value) {
+        this.circulation.zjddm = value;
+        var form = {};
+        form.zjddm = value;
+        getByZjddm(form).then(qlrRes => {
+          console.log(qlrRes.data.shyqrdm)
+          this.circulation.shyqrdm = qlrRes.data.shyqrdm;
+          this.$forceUpdate();
+        });
+        this.showZjd = false;
 
-  },
-  methods: {
-    onConfirm(value) {
-      this.value = value;
-      this.showPicker = false;
+      }, //宅基地列表
+      onConfirmShyqrdm(value) {
+        this.showShyqrdm = false;
+      }, //转出方使用权人代码
+      onConfirmLzqfwyt(value) {
+        this.lzqfwyt = value.text;
+        this.circulation.lzqfwyt = value.value;
+        this.showLzqfwyt = false;
+      }, //流转前房屋用途
+      onConfirmLzhfwyt(value) {
+        this.lzhfwyt = value.text;
+        this.circulation.lzhfwyt = value.value;
+        this.showLzhfwyt = false;
+      }, //流转后房屋用途
+      onConfirmZrfdbmc(value) {
+        this.value = value;
+        this.showZrfdbmc = false;
+      }, //转入方代表名称
+      onConfirmZrfdbzjlx(value) {
+        this.zrfdbzjlx = value.text;
+        this.circulation.zrfdbzjlx = value.value;
+        this.showZrfdbzjlx = false;
+      }, //转入方代表证件类型
+      onConfirmLzqsrq(value) {
+        this.circulation.lzqsrq = this.getNowFormatDate(value).substr(0,10);
+        this.showlzqsrq = false;
+      }, //流转起始时间
+      onConfirmLzjsrq(value) {
+        this.circulation.lzjsrq = this.getNowFormatDate(value).substr(0,10);
+        this.showlzjsrq = false;
+      }, //流转结束时间
+      goEdit(){
+        console.log(this.circulation)
+        houseAdd(this.circulation).then(response => {
+          if(response.code = 200){
+            this.$toast.success('保存成功');
+          }
+        });
+      },
+      goSubmit(){
+        goApply(this.$route.query.id).then(response => {
+          if(response.code = 200){
+            this.$toast.success('提交成功');
+            setTimeout(function(){
+              window.location.replace("circulationList")
+            },1000)
+          }
+        });
+      },
     },
-  },
-}
+  }
 </script>
 
 <style scoped lang="scss">

src/views/onlineHome/homestead/circulation/circulationDetail.vue

@@ -0,0 +1,174 @@
+<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>
+        <p class="main_title">转出方信息</p>
+        <div class="main_box">
+          <van-field
+            readonly
+            v-model="circulation.zjddm"
+            label="宅基地代码"
+            input-align="right"
+          />
+
+          <van-field
+            readonly
+            v-model="circulation.lzfs"
+            label="流转方式"
+            input-align="right"
+          />
+
+          <van-field
+            readonly
+            v-model="circulation.shyqrdm"
+            label="转出方使用权人代码"
+            label-width="auto"
+            input-align="right"
+          />
+          <van-field
+            readonly
+            v-model="circulation.zcfsfbjtjjzzcy == 'Y' ? '是' : '否'"
+            label="是否本集体经济组织成员"
+            label-width="auto"
+            input-align="right"
+
+          />
+        </div>
+
+        <p class="main_title">流转信息</p>
+        <div class="main_box">
+          <van-field label="流转面积(㎡)" readonly v-model="circulation.lzmj" input-align="right" label-width="auto"/>
+          <van-field label="流转单价(元)" readonly v-model="circulation.lzdj" input-align="right" label-width="auto"/>
+          <van-field label="流转费用(元)" readonly v-model="circulation.lzfy" input-align="right" label-width="auto"/>
+          <van-field
+            readonly
+            label="流转起始时间"
+            input-align="right"
+            v-model="circulation.lzqsrq"
+          />
+
+          <van-field
+            readonly
+            label="流转结束时间"
+            input-align="right"
+            v-model="circulation.lzjsrq"
+          />
+
+          <van-field
+            readonly
+            label="流转前房屋用途"
+            input-align="right"
+            label-width="auto"
+            v-model="circulation.lzqfwyt"
+          />
+
+          <van-field
+            readonly
+            label="流转后房屋用途"
+            input-align="right"
+            label-width="auto"
+            v-model="circulation.lzhfwyt"
+          />
+        </div>
+
+        <p class="main_title">转入方信息</p>
+        <div class="main_box">
+          <van-field
+            readonly
+            label="转入方代表名称"
+            label-width="auto"
+            input-align="right"
+            v-model="circulation.zrfdbmc"
+          />
+
+          <van-field
+            readonly
+            label="转入方代表证件类型"
+            label-width="auto"
+            input-align="right"
+            v-model="circulation.zrfdbzjlx"
+          />
+          <van-field readonly label="转入方代表证件号码" v-model="circulation.zrfdbzjhm" input-align="right" label-width="auto"/>
+          <van-field readonly label="是否本集体经济组织成员" v-model="circulation.zrfsfbjtjjzzcy == 'Y' ? '是' : '否'" input-align="right" label-width="auto"/>
+        </div>
+
+        <p class="main_title">其他</p>
+        <div class="main_box">
+          <van-field readonly label="所有权人代表姓名" v-model="circulation.suyqrdbxm" input-align="right" label-width="auto"/>
+          <van-field readonly label="所有权人意见" v-model="circulation.suyqryj" input-align="right" label-width="auto"/>
+          <van-field readonly label="备注" v-model="circulation.bz" input-align="right" label-width="auto"/>
+        </div>
+    </div>
+</template>
+
+<script>
+import { getLz } from "@/api/onlineHome/homestead/circulation";
+export default {
+    name: "circulationDetail",
+  data() {
+    return {
+      value: '',
+      circulation:[],
+      houseApplyStatus:[],
+      circulation:[],
+    };
+  },
+  created() {
+    this.getDetail();
+  },
+  methods: {
+    getDetail(){
+      getLz(this.$route.query.id).then(response => {
+        this.circulation = response.data;
+        //流转方式
+        this.houseGetDicts("lzfs").then((res) => {
+          this.circulation.lzfs = this.selectDictLabel(res.data, response.data.lzfs);
+        });
+        //转入方证件类型
+        this.houseGetDicts("zjlx").then((res) => {
+          this.circulation.zrfdbzjlx = this.selectDictLabel(res.data, response.data.zrfdbzjlx);
+        });
+        //流转前房屋用途
+        this.houseGetDicts("fwyt").then((res) => {//流转前房屋用途
+          this.circulation.lzqfwyt = this.selectDictLabel(res.data, response.data.lzqfwyt);
+          this.circulation.lzhfwyt = this.selectDictLabel(res.data, response.data.lzhfwyt);
+        });
+      });
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding-bottom: 5%;
+  }
+  .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>

src/views/onlineHome/homestead/circulation/circulationList.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,106 @@
           <van-icon name="add" size="18" />
         </template>
       </van-nav-bar>
-      <van-swipe-cell v-for="(item,index) in 10">
-        <van-cell title="440604100202000000Z00012" value="待审" center >
-          <template #icon>
-            <van-icon name="../../../static/images/icon/icon_jt.png" size="22" color="#539FFD" style="margin-right: 10px;" />
-          </template>
-          <template #label>
-            <p><b style="color: #FFA63E;">转让</b><i style="margin-right: 0.5rem;"></i><b style="color: #333333;">刘浩泽</b><i style="margin-right: 0.5rem;"></i>59㎡</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.shyqrdm" :value="item.auditStatus" center :to="{name:'circulationDetail', query: {id:item.id}}">
+            <template #icon>
+              <van-icon name="../../../static/images/icon/icon_jt.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+            </template>
+            <template #label>
+              <p><b style="color: #FFA63E;">{{item.lzfs}}</b><i style="margin-right: 0.5rem;"></i><b style="color: #333333;">{{item.zrfdbmc}}</b><i style="margin-right: 0.5rem;"></i>{{item.lzmj}}㎡</p>
+            </template>
+          </van-cell>
+          <template #right>
+            <van-row>
+              <van-col>
+                <van-button square text="修改" type="info" v-if="item.auditStatus=='草稿'" class="delete-button" :to="{name:'circulationModify', query: {id:item.id}}" />
+              </van-col>
+              <van-col>
+                <van-button square text="删除" type="danger" v-if="item.auditStatus=='草稿'" @click="deleteList(item.id,index)" 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 , removeList } from "@/api/onlineHome/homestead/circulation";
 export default {
     name: "circulationList",
   data() {
     return {
-
+      applicationList:[],
+      houseApplyStatus:[],
+      auditStatus:[],
+      loading: false,
+      finished: false,
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        orderByColumn:'createTime',
+        isAsc:'desc'
+      }
     };
   },
   created() {
-
+    this.houseGetDicts("lzfs").then((response) => {
+      this.houseApplyStatus = response.data;
+    });
+    this.houseGetDicts("audit_status").then((response) => {
+      this.auditStatus = response.data;
+    });
   },
   methods: {
-
+    goAdd(){
+      window.location = 'circulationAdd';
+    },
+    getList(){
+      setTimeout(() => {
+        getList(this.queryParams).then(response => {
+          console.log(response)
+          for (var i = 0; i < response.rows.length; i++) {
+            var houseApplyStatus = this.selectDictLabel(this.houseApplyStatus, response.rows[i].lzfs);
+            response.rows[i].lzfs = houseApplyStatus;
+            var auditStatus = this.selectDictLabel(this.auditStatus, response.rows[i].auditStatus);
+            response.rows[i].auditStatus = auditStatus;
+            this.applicationList.push(response.rows[i]);
+          }
+          console.log(this.applicationList.length >= response.total)
+          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
+        });
+    }
   },
 }
 </script>

src/views/onlineHome/homestead/circulation/circulationModify.vue

@@ -0,0 +1,407 @@
+<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>
+        <p class="main_title">转出方信息</p>
+        <div class="main_box">
+          <van-field
+            readonly
+            clickable
+            v-model="circulation.zjddm"
+            label="宅基地代码"
+            placeholder="请选择"
+            @click="showZjd = true"
+            input-align="right"
+            right-icon="arrow-down"
+          />
+          <van-popup v-model="showZjd" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="zjdDictionaries"
+              @confirm="onConfirmZjd"
+              @cancel="showZjd = false"
+            />
+          </van-popup>
+
+          <van-field
+            readonly
+            clickable
+            v-model="lzfs"
+            label="流转方式"
+            placeholder="请选择"
+            @click="showLzfs = true"
+            input-align="right"
+            right-icon="arrow-down"
+          />
+          <van-popup v-model="showLzfs" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="lzfsDictionaries"
+              @confirm="onConfirmLzfs"
+              @cancel="showLzfs = false"
+            />
+          </van-popup>
+
+          <van-field
+            v-model="circulation.shyqrdm"
+            label="转出方使用权人代码"
+            placeholder="请选择"
+            label-width="auto"
+            input-align="right"
+          />
+<!--          @click="showShyqrdm = true"-->
+<!--          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-cell title="是否本集体经济组织成员">
+            <template #right-icon>
+              <van-radio-group v-model="circulation.zcfsfbjtjjzzcy" direction="horizontal">
+                <van-radio name="Y">是</van-radio>
+                <van-radio name="N">否</van-radio>
+              </van-radio-group>
+            </template>
+          </van-cell>
+        </div>
+
+        <p class="main_title">流转信息</p>
+        <div class="main_box">
+          <van-field label="流转面积(㎡)" v-model="circulation.lzmj" placeholder="请输入流转面积(㎡)" input-align="right" label-width="auto"/>
+          <van-field label="流转单价(元)" v-model="circulation.lzdj" placeholder="请输入流转单价(元)" input-align="right" label-width="auto"/>
+          <van-field label="流转费用(元)" v-model="circulation.lzfy" placeholder="请输入流转费用(元)" input-align="right" label-width="auto"/>
+          <van-field
+            readonly
+            clickable
+            v-model="circulation.lzqsrq"
+            label="流转起始时间"
+            placeholder="请选择起始时间"
+            @click="showlzqsrq = true"
+            input-align="right"
+            right-icon="arrow-down"
+          />
+          <van-popup v-model="showlzqsrq" position="bottom">
+            <van-datetime-picker
+              v-model="currentDate"
+              type="date"
+              title="选择年月日"
+              :min-date="minDate"
+              :max-date="maxDate"
+              @confirm="onConfirmLzqsrq"
+            />
+          </van-popup>
+
+          <van-field
+            readonly
+            clickable
+            v-model="circulation.lzjsrq"
+            label="流转结束时间"
+            placeholder="请选择结束时间"
+            @click="showlzjsrq = true"
+            input-align="right"
+            right-icon="arrow-down"
+          />
+          <van-popup v-model="showlzjsrq" position="bottom">
+            <van-datetime-picker
+              v-model="currentDate"
+              type="date"
+              title="选择年月日"
+              :min-date="minDate"
+              :max-date="maxDate"
+              @confirm="onConfirmLzjsrq"
+            />
+          </van-popup>
+
+          <van-field
+            readonly
+            clickable
+            v-model="lzqfwyt"
+            label="流转前房屋用途"
+            placeholder="请选择流转前房屋用途"
+            @click="showLzqfwyt = true"
+            input-align="right"
+            right-icon="arrow-down"
+            label-width="auto"
+          />
+          <van-popup v-model="showLzqfwyt" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="lzqfwytDictionaries"
+              @confirm="onConfirmLzqfwyt"
+              @cancel="showLzqfwyt = false"
+            />
+          </van-popup>
+
+          <van-field
+            readonly
+            clickable
+            v-model="lzhfwyt"
+            label="流转后房屋用途"
+            placeholder="请选择流转后房屋用途"
+            @click="showLzhfwyt = true"
+            input-align="right"
+            right-icon="arrow-down"
+            label-width="auto"
+          />
+          <van-popup v-model="showLzhfwyt" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="lzhfwytDictionaries"
+              @confirm="onConfirmLzhfwyt"
+              @cancel="showLzhfwyt = false"
+            />
+          </van-popup>
+        </div>
+
+        <p class="main_title">转入方信息</p>
+        <div class="main_box">
+          <van-field
+            v-model="circulation.zrfdbmc"
+            label="转入方代表名称"
+            placeholder="请输入转入方代表名称"
+            label-width="auto"
+            input-align="right"
+          />
+<!--          <van-popup v-model="showZrfdbmc" position="bottom">-->
+<!--            <van-picker-->
+<!--              show-toolbar-->
+<!--              :columns="zrfdbmcDictionaries"-->
+<!--              @confirm="onConfirmZrfdbmc"-->
+<!--              @cancel="showZrfdbmc = false"-->
+<!--            />-->
+<!--          </van-popup>-->
+
+          <van-field
+            readonly
+            clickable
+            v-model="zrfdbzjlx"
+            label="转入方代表证件类型"
+            placeholder="请选择"
+            @click="showZrfdbzjlx = true"
+            label-width="auto"
+            input-align="right"
+            right-icon="arrow-down"
+          />
+          <van-popup v-model="showZrfdbzjlx" position="bottom">
+            <van-picker
+              show-toolbar
+              :columns="zrfdbzjlxDictionaries"
+              @confirm="onConfirmZrfdbzjlx"
+              @cancel="showZrfdbzjlx = false"
+            />
+          </van-popup>
+
+          <van-field label="转入方代表证件号码" v-model="circulation.zrfdbzjhm" placeholder="请输入证件号码" input-align="right" label-width="auto"/>
+          <van-cell title="是否本集体经济组织成员">
+            <template #right-icon>
+              <van-radio-group  v-model="circulation.zrfsfbjtjjzzcy" direction="horizontal">
+                <van-radio name="Y">是</van-radio>
+                <van-radio name="N">否</van-radio>
+              </van-radio-group>
+            </template>
+          </van-cell>
+        </div>
+
+        <p class="main_title">其他</p>
+        <div class="main_box">
+          <van-field label="所有权人代表姓名" v-model="circulation.suyqrdbxm" placeholder="请输入姓名" input-align="right" label-width="auto"/>
+          <van-field label="所有权人意见" v-model="circulation.suyqryj" placeholder="请输入内容" input-align="right" label-width="auto"/>
+          <van-field label="备注" v-model="circulation.bz" 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" native-type="submit" class="submitButton" @click="goEdit">保<i style="margin-right: 1em;"></i>存</van-button>
+            </van-col>
+            <van-col span="12" align="center">
+              <van-button type="info" native-type="submit" class="submitButton" @click="goSubmit">提<i style="margin-right: 1em;"></i>交</van-button>
+            </van-col>
+          </van-row>
+          <div class="clear"></div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { getLz , zjdzd , getByZjddm , edit , goApply } from "@/api/onlineHome/homestead/circulation";
+export default {
+    name: "circulationModify",
+  data() {
+    return {
+      lzfsDictionaries: [],//流转方式
+      shyqrdmDictionaries: [],//转出方使用权人代码
+      lzqfwytDictionaries: [],//流转前房屋类型
+      lzhfwytDictionaries: [],//流转后房屋类型
+      zrfdbmcDictionaries: [],//转入方代表名称
+      zrfdbzjlxDictionaries: [],//转入方证件类型
+      zjdDictionaries: [],//宅基地列表
+      lzfs: '',//流转方式
+      shyqrdm: '',//转出方使用权人代码
+      lzqfwyt: '',//流转前房屋类型
+      lzhfwyt: '',//流转后房屋类型
+      zrfdbmc: '',//转入方代表名称
+      zrfdbzjlx: '',//转入方证件类型
+      zjd: [],//宅基地列表
+      showLzfs: false,
+      showShyqrdm: false,
+      showLzqfwyt: false,
+      showLzhfwyt: false,
+      showZrfdbmc: false,
+      showZrfdbzjlx: false,
+      showZjd:false,
+      showlzqsrq:false,
+      showlzjsrq:false,
+      minDate: new Date(),
+      maxDate: new Date(2025, 10, 1),
+      currentDate: new Date(),
+      circulation:[]
+    };
+  },
+  created() {
+    this.getDetail();
+  },
+  methods: {
+    getDetail(){
+      getLz(this.$route.query.id).then(response => {
+        console.log(response)
+        //流转方式
+        this.houseGetDicts("lzfs").then((res) => {
+          for( let i = 0 ; i < res.data.length ; i++){
+            this.lzfsDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
+          }
+          this.lzfs = this.selectDictLabel(res.data, response.data.lzfs);
+        });
+        //转入方证件类型
+        this.houseGetDicts("zjlx").then((res) => {
+          for( let i = 0 ; i < res.data.length ; i++){
+            this.zrfdbzjlxDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
+          }
+          this.zrfdbzjlx = this.selectDictLabel(res.data, response.data.zrfdbzjlx);
+        });
+        //宅基地代码
+        zjdzd().then(zjdRes => {
+          for( let i = 0 ; i < zjdRes.rows.length ; i++){
+            this.zjdDictionaries.push(zjdRes.rows[i].zjddm);
+          }
+          var form = {};
+          form.zjddm = zjdRes.rows[0].zjddm;
+          // getByZjddm(form).then(qlrRes => {
+          //   this.circulation.shyqrdm = qlrRes.data.shyqrdm;
+          // });
+        });
+        //流转前房屋用途
+        this.houseGetDicts("fwyt").then((res) => {//流转前房屋用途
+          console.log(res)
+          for( let i = 0 ; i < res.data.length ; i++){
+            this.lzqfwytDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
+          }
+          this.lzqfwyt = this.selectDictLabel(res.data, response.data.lzqfwyt);
+        });
+        //流转后房屋用途
+        this.houseGetDicts("fwyt").then((res) => {//流转后房屋用途
+          for( let i = 0 ; i < res.data.length ; i++){
+            this.lzhfwytDictionaries.push({text:res.data[i].dictLabel,value:res.data[i].dictValue})
+          }
+          this.lzhfwyt = this.selectDictLabel(res.data, response.data.lzhfwyt);
+        });
+
+        this.circulation = response.data;
+      });
+    },
+    onConfirmLzfs(value) {
+      this.lzfs = value.text;
+      this.circulation.lzfs = value.value;
+      this.showLzfs = false;
+    }, //流转方式
+    onConfirmZjd(value) {
+      this.showZjd = false;
+    }, //宅基地列表
+    onConfirmShyqrdm(value) {
+      this.showShyqrdm = false;
+    }, //转出方使用权人代码
+    onConfirmLzqfwyt(value) {
+      this.lzqfwyt = value.text;
+      this.circulation.lzqfwyt = value.value;
+      this.showLzqfwyt = false;
+    }, //流转前房屋用途
+    onConfirmLzhfwyt(value) {
+      this.lzhfwyt = value.text;
+      this.circulation.lzhfwyt = value.value;
+      this.showLzhfwyt = false;
+    }, //流转后房屋用途
+    onConfirmZrfdbmc(value) {
+      this.value = value;
+      this.showZrfdbmc = false;
+    }, //转入方代表名称
+    onConfirmZrfdbzjlx(value) {
+      this.zrfdbzjlx = value.text;
+      this.circulation.zrfdbzjlx = value.value;
+      this.showZrfdbzjlx = false;
+    }, //转入方代表证件类型
+    onConfirmLzqsrq(value) {
+      this.circulation.lzqsrq = this.getNowFormatDate(value).substr(0,10);
+      this.showlzqsrq = false;
+    }, //流转起始时间
+    onConfirmLzjsrq(value) {
+      this.circulation.lzjsrq = this.getNowFormatDate(value).substr(0,10);
+      this.showlzjsrq = false;
+    }, //流转结束时间
+    goEdit(){
+      edit(this.circulation).then(response => {
+        if(response.code = 200){
+          this.$toast.success('保存成功');
+        }
+      });
+    },
+    goSubmit(){
+      goApply(this.$route.query.id).then(response => {
+        if(response.code = 200){
+          this.$toast.success('提交成功');
+          setTimeout(function(){
+            window.location.replace("circulationList")
+          },1000)
+        }
+      });
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+  }
+  .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>

src/views/onlineHome/homestead/homeApplication/applicationForm.vue

@@ -242,7 +242,7 @@
             </div>
             <div class="mapBox">
               <div id="mapWrap" style="height: 200px;"></div>
-              <div class="mapBox_button">
+              <div class="mapBox_button" v-if="auditStatus == false">
                 <van-button id="drawPolygon" native-type="button" icon="../../../static/images/icon/icon_ht.png" type="default" block round size="small"></van-button>
                 <van-button id="drawRemove" native-type="button" icon="cross" type="default" block round size="small" style="margin-top: 0.2rem"></van-button>
               </div>
@@ -293,7 +293,7 @@
 <!--            <van-uploader v-model="fileList2" multiple class="aaa" />-->
 <!--          </div>-->
 
-          <div v-if="applicationDetail.tHouseApplyProposer" style="margin: 16px;">
+          <div v-if="applicationDetail.tHouseApplyProposer && auditStatus == false" style="margin: 16px;">
             <van-row>
               <van-col span="12" align="center">
                 <van-button type="info" native-type="submit" class="submitButton" @click="onSubmit('keep')">保存</van-button>
@@ -725,6 +725,7 @@
           saveHouseBaseInfoThenSubmit(form).then(res => {
             if(res.code = 200){
               that.$toast.success('提交成功');
+              that.getDetail();
             }
           });
         }