承包地块接口对接

src/api/contracted/cbdkxx.js

@@ -0,0 +1,54 @@
+import request from '@/utils/request';
+
+// 承包地块信息列表
+export function listCbdkxx(params) {
+    return request({
+      url: '/service/cbdkxx/mobile/list',
+      method: 'get',
+      params: params
+    });
+}
+
+// 承包地块详情
+export function getCbdkxx(id) {
+  return request({
+    url: '/service/cbdkxx/get/' + id,
+    method: 'get'
+  });
+}
+
+// 新增承包地块信息
+export function addCbdkxx(data) {
+  return request({
+    url: '/service/cbdkxx/insert',
+    method: 'post',
+    data: data
+  });
+}
+
+// 修改承包地块信息
+export function updateCbdkxx(data) {
+  return request({
+    url: '/service/cbdkxx/modify',
+    method: 'post',
+    data: data
+  });
+}
+
+// 删除承包地块信息
+export function deleteCbdkxx(id) {
+  return request({
+    url: '/service/cbdkxx/delete/' + id,
+    method: 'get'
+  });
+}
+
+// 转出承包地块
+export function transferCbdkxx(params) {
+  return request({
+    url: '/service/cbdkxx/transfer',
+    method: 'get',
+    params: params
+  });
+}
+

src/api/contracted/dk.js

@@ -0,0 +1,10 @@
+import request from '@/utils/request';
+
+// 地块信息列表
+export function listDk(params) {
+  return request({
+    url: '/service/dk/list',
+    method: 'get',
+    params: params
+  });
+}

src/components/house/CommonMap.vue

@@ -105,7 +105,7 @@ export default {
         view: new ol.View({
           center: ol.proj.fromLonLat(this.coord),
           //zoom: false,
-          zoom: 17.9,
+          zoom: 17,
           minZoom: this.minMapZoom, //地图缩小限制
           maxZoom: this.maxMapZoom, //地图放大限制
         }),
@@ -248,6 +248,7 @@ export default {
           self.drawInsert = null;
           self.mapObject.removeInteraction(draw);
           self.popLayer(COMMON_MAP_DRAW_LAYER_NAME);
+          self.$emit("drawFinished", null);
           //console.log("drawRemove");
         });
         //还原之前图层
@@ -308,9 +309,9 @@ export default {
       this.mapObject.getView().animate({
         // 只设置需要的属性即可
         center: center, // 中心点
-        zoom: 17.9, // 缩放级别
+        zoom: 17, // 缩放级别
         rotation: undefined, // 缩放完成view视图旋转弧度
-        duration: 1000, // 缩放持续时间，默认不需要设置
+        duration: 300, // 缩放持续时间，默认不需要设置
       });
       return true;
     },
@@ -371,7 +372,7 @@ export default {
       this.mapObject.getView().animate({
         // 只设置需要的属性即可
         center: center, // 中心点
-        zoom: 17.9, // 缩放级别
+        zoom: 17, // 缩放级别
         rotation: undefined, // 缩放完成view视图旋转弧度
         duration: 1000, // 缩放持续时间，默认不需要设置
       });

src/views/contracted/village/contractor/contractWord.vue

@@ -19,7 +19,7 @@
 
     <div class="list_main">
       <van-form ref="formData">
-        <van-field v-model="form.cbhtbm" label="承包合同代码：" placeholder="请输入承包合同代码" required :rules="[{ required: true }]" :border="false" input-align="left" />
+        <van-field v-model="form.cbhtbm" label="承包合同代码：" placeholder="请输入承包合同代码" required :rules="[{ required: true }]" :border="false" input-align="left" :disabled="isDisabled" />
         <van-field v-model="form.ycbhtbm" label="原承包合同代码：" placeholder="请输入原承包合同代码" :border="false" input-align="left" />
         <van-field v-model="form.fbfbm" label="发包方代码：" placeholder="请输入发包方代码" required :rules="[{ required: true }]" :border="false" input-align="left" />
         <van-field
@@ -44,7 +44,7 @@
             @cancel="showType = false"
           />
         </van-popup>
-        <van-field v-model="form.cbfbm" label="承包方代码：" placeholder="请输入承包方代码" required :rules="[{ required: true }]" :border="false" input-align="left" />
+        <van-field v-model="form.cbfbm" label="承包方代码：" placeholder="请输入承包方代码" required :rules="[{ required: true }]" :border="false" input-align="left" :disabled="isDisabled" />
         <van-field v-model="form.cbfmc" label="承包方名称：" placeholder="请输入承包方名称" required :rules="[{ required: true }]" :border="false" input-align="left" />
         <van-field
           v-model="cbfsText"
@@ -105,7 +105,7 @@
           clickable
           @click="showCbqxq = true"
         >
-          <template #button v-if="form.id">
+          <template #button>
             <van-button size="small" type="primary" native-type="button" @click.stop="extension">延期</van-button>
           </template>
         </van-field>
@@ -178,6 +178,7 @@
         showCbqxz: false,         // 控制承包结束时间弹出层的显示和隐藏
         minDate: new Date(1978, 0, 1),
         maxDate: new Date(2100, 11, 31),
+        isDisabled: false
       };
     },
     created() {
@@ -196,7 +197,9 @@
           if (this.form) {
             this.cbflxText = this.selectDictLabel(this.cbflxOptions, this.form.cbflx);
             this.cbfsText = this.selectDictLabel(this.cbfsOptions, this.form.cbfs);
+            this.isDisabled = true;
           } else {
+            this.isDisabled = false;
             this.resetForm();
           }
         });
@@ -254,6 +257,9 @@
                   icon: 'success',
                   message: '保存成功',
                   duration:"1000",
+                  onClose: () => {
+                    this.getDetail();
+                  }
                 });
               }
             });
@@ -280,20 +286,22 @@
         };
       },
       extension() {
-        this.$dialog.confirm({
-          message: '是否确认将此份承包合同的承包期限延长30年？',
-        }).then(() => {
-          // on confirm
-          extendCbht(this.form.id).then(response => {
-            if (response.code == 200) {
-              this.$toast.success('延期成功');
-              this.form.cbqxq = response.data.startTime;
-              this.form.cbqxz = response.data.endTime;
-            }
+        if (this.form.id) {
+          this.$dialog.confirm({
+            message: '是否确认将此份承包合同的承包期限延长30年？',
+          }).then(() => {
+            // on confirm
+            extendCbht(this.form.id).then(response => {
+              if (response.code == 200) {
+                this.$toast.success('延期成功');
+                this.form.cbqxq = response.data.startTime;
+                this.form.cbqxz = response.data.endTime;
+              }
+            });
+          }).catch(() => {
+            // on cancel
           });
-        }).catch(() => {
-          // on cancel
-        });
+        }
       }
     },
   };
@@ -336,24 +344,28 @@
     width: 225px;
   }
 
-  /* .tb_main{
-    position: relative;
-    p{
-      position: absolute;
-      display: inline-block;
-      margin-left: 10PX;
-    }
+  /deep/ .van-field--disabled .van-field__label {
+    color: #646566;
   }
 
-  .tb{
-    font-size: 12px;
-    color: #ff8900;
-    background: #daf6e7;
-    border: 1px solid #d7be6e;
-    padding: 2PX 8PX;
-    border-radius: 50PX;
-    margin-right: 5PX;
-  } */
+    /* .tb_main{
+      position: relative;
+      p{
+        position: absolute;
+        display: inline-block;
+        margin-left: 10PX;
+      }
+    }
+
+    .tb{
+      font-size: 12px;
+      color: #ff8900;
+      background: #daf6e7;
+      border: 1px solid #d7be6e;
+      padding: 2PX 8PX;
+      border-radius: 50PX;
+      margin-right: 5PX;
+    } */
 
   .tap_block{
     width: 100%;

src/views/contracted/village/contractor/contractorDetail.vue

@@ -19,6 +19,7 @@
 
     <div class="list_main">
       <van-form ref="formData">
+        <van-field v-model="form.cbfbm" label="代码：" placeholder="请输入代码" required :rules="[{ required: true }]" :border="false" input-align="left" disabled />
         <van-field
           v-model="form.cbflxText"
           label="类型："
@@ -41,7 +42,6 @@
             @cancel="showType = false"
           />
         </van-popup>
-        <van-field v-model="form.cbfbm" label="代码：" placeholder="请输入代码" required :rules="[{ required: true }]" :border="false" input-align="left" readonly />
         <van-field v-model="form.cbfmc" label="名称：" placeholder="请输入名称" required :rules="[{ required: true }]" :border="false" input-align="left" />
         <van-field
           v-model="form.cbfzjlxText"
@@ -197,6 +197,10 @@
     overflow: initial;
   }
 
+  /deep/ .van-field--disabled .van-field__label {
+    color: #646566;
+  }
+
   /* .tb_main{
     position: relative;
     p{

src/views/contracted/village/contractor/contractorDetailAdd.vue

@@ -10,6 +10,11 @@
     </van-nav-bar>
 
     <div class="list_main">
+      <van-field v-model="form.cbfbm" label="代码：" placeholder="请输入代码" required :rules="[{ required: true }]" :border="false" input-align="left">
+        <template #button>
+          <van-button size="mini" type="primary" native-type="button" @click="generateCode">生成代码</van-button>
+        </template>
+      </van-field>
       <van-form ref="formData">
         <van-field
           v-model="cbflxText"
@@ -33,11 +38,6 @@
             @cancel="showType = false"
           />
         </van-popup>
-        <van-field v-model="form.cbfbm" label="代码：" placeholder="请输入代码" required :rules="[{ required: true }]" :border="false" input-align="left">
-          <template #button>
-            <van-button size="mini" type="primary" native-type="button" @click="generateCode">生成代码</van-button>
-          </template>
-        </van-field>
         <van-field v-model="form.cbfmc" label="名称：" placeholder="请输入名称" required :rules="[{ required: true }]" :border="false" input-align="left" />
         <van-field
           v-model="cbfzjlxText"

src/views/contracted/village/contractor/contractorLand.vue

@@ -8,65 +8,73 @@
         </div>
       </template>
     </van-nav-bar> -->
-    <contractor-header></contractor-header>
+    <contractor-header :dept-id="$route.params.deptId" :contractor-code="$route.params.cbfbm" :contractor-name="$route.params.cbfmc" :survey-status="$route.params.surveyStatus"></contractor-header>
 
     <div class="tap_block">
-      <p @click="$router.push({path:'/contracted/village/contractorDetail'})">承包方</p>
-      <p @click="$router.push({path:'/contracted/village/contractorFamily'})">家庭成员</p>
-      <p @click="$router.push({path:'/contracted/village/contractorWord'})">承包合同</p>
+      <p @click="skip('contractedVillageContractorDetail')">承包方</p>
+      <p @click="skip('contractedVillageContractorFamily')">家庭成员</p>
+      <p @click="skip('contractedVillageContractorWord')">承包合同</p>
       <p class="active">承包地</p>
     </div>
 
     <div class="function_main">
-      <div class="function_btn1" @click="goMap">
+      <div class="function_btn1" @click="skip('contractedVillageContractorLandMap')">
         <p class="active">进入地图 <span class="sanjiao-right"></span></p>
       </div>
-      <div class="function_btn2" @click="goDetail">
+      <div class="function_btn2" @click="goDetail()">
         <p class="active"> + 新增</p>
       </div>
     </div>
 
     <div class="list_main">
 
-      <van-swipe-cell v-for="(item,index) in 10">
-
-        <div class="item" @click="goDetail">
-
+      <van-swipe-cell v-for="(item,index) in landList" :key="item.id">
+        <div class="item" @click="goDetail(item.id)">
           <div class="item_tt">
-            <p>西湖地块名称名称名称</p>
-            <p>371481199201011234</p>
+            <p>{{ item.dkmc }}</p>
+            <p>{{ item.dkbm }}</p>
           </div>
-
           <div class="item_type">
-            <p>3.5亩</p>
-            <p>旱地</p>
-            <p><span>2</span>等地</p>
-            <p>种植业</p>
-            <p>基本农田:是</p>
+            <p>{{ item.htmjm }}亩</p>
+<!--            <p>{{ item.tdlylx }}</p>-->
+            <p>{{ item.dldj }}</p>
+            <p>{{ item.tdyt }}</p>
+            <p>基本农田:{{ item.sfjbnt }}</p>
           </div>
-
           <div class="item_direction">
-            <p>张三指界</p>
-            <p>东:张琪</p>
-            <p>西:马六</p>
-            <p>南:河流</p>
-            <p>北:道路</p>
+<!--            <p>{{ item.zjrxm }}指界</p>-->
+            <p>东:{{ item.dkdz }}</p>
+            <p>西:{{ item. dkxz }}</p>
+            <p>南:{{ item.dknz }}</p>
+            <p>北:{{ item.dkbz }}</p>
           </div>
-
         </div>
         <template #right>
           <div class="operation">
             <!-- delete 删除 edit编辑 view查看 list榜单 -->
-            <div class="opera_btn delete">
-              <p>取消<br/>承包</p>
-            </div>
-            <div class="opera_btn edit">
+            <div class="opera_btn edit" @click="transferLand(item.id)">
               <p>转给<br/>他方</p>
             </div>
+            <div class="opera_btn delete" @click="deleteLand(item.id, index)">
+              <p>取消<br/>承包</p>
+            </div>
           </div>
         </template>
       </van-swipe-cell>
-
+      <van-popup v-model="showContractorPopup" position="bottom">
+        <van-picker
+          show-toolbar
+          :columns="contractorList"
+          @confirm="onConfirmContractorOptions"
+          @cancel="showContractorPopup = false"
+        >
+          <template #option="option">
+            <div style="display: flex; flex-direction: column; align-items: center;">
+              <div>{{option.cbfmc}}-{{option.cbfbm}}</div>
+            </div>
+          </template>
+        </van-picker>
+      </van-popup>
     </div>
 
 
@@ -75,6 +83,8 @@
 <script>
   import Cookies from "js-cookie";
   import contractorHeader from "./contractorHeader";
+  import { listCbdkxx, deleteCbdkxx, transferCbdkxx } from "@/api/contracted/cbdkxx";
+  import { listCbf } from "@/api/contracted/cbf";
 
   export default {
     name: "contractedVillageContractor",
@@ -83,44 +93,98 @@
     },
     data() {
       return {
-        loading:false,
-        finished:true,
-        value:'',
-        showType:false,
-        showZjType:false,
-        typeOptions:[{
-          dictLabel:'类型1',
-          dictValue:'1',
-        }],
-        zjTypeOptions:[{
-          dictLabel:'类型2',
-          dictValue:'1',
-        }],
+        landList: [],                   // 承包地块列表
+        contractorList: [],             // 承包方列表
+        showContractorPopup: false,     // 控制承包方信息弹出层的显示和隐藏
+        transferLandId: null            // 转出的承包地块ID
       };
     },
     created() {
-
+      this.getList();
+      this.getContractorList();
     },
     methods: {
       getList(){
-
+        listCbdkxx({cbfbm: this.$route.params.cbfbm, translate_dict: 1}).then(response => {
+          this.landList = response.rows;
+        });
       },
-      onSearch(){
-
+      getContractorList() {
+        listCbf({deptId: this.$route.params.deptId}).then(response => {
+          this.contractorList = response.rows;
+        });
       },
-      onConfirmTypeOptions(){
-
+      goDetail(id){
+        this.$router.push({
+          name: 'contractedVillageContractorLandDetail',
+          params: {
+            id: id,
+            deptId: this.$route.params.deptId,
+            cbfbm: this.$route.params.cbfbm,
+            cbfmc: this.$route.params.cbfmc,
+            surveyStatus: this.$route.params.surveyStatus
+          }
+        });
       },
-      onConfirmZjTypeOptions(){
-
+      skip(name) {
+        this.$router.push({
+          name: name,
+          params: {
+            deptId: this.$route.params.deptId,
+            cbfbm: this.$route.params.cbfbm,
+            cbfmc: this.$route.params.cbfmc,
+            surveyStatus: this.$route.params.surveyStatus
+          }
+        });
       },
-      goDetail(){
-        this.$router.push({path:'/contracted/village/contractorLandDetail'});
+      transferLand(id) {
+        this.transferLandId = id;
+        this.showContractorPopup = true;
       },
-      goMap(){
-        this.$router.push({path:'/contracted/village/contractorLandMap'});
+      onConfirmContractorOptions(value) {
+        this.$dialog.confirm({
+          message: '是否确认将此承包地块转给' + value.cbfmc + '？',
+        }).then(() => {
+          // on confirm
+          this.showContractorPopup = false;
+          transferCbdkxx({id: this.transferLandId, cbfbm: value.cbfbm}).then(response => {
+            if (response.code == 200) {
+              this.$toast({
+                icon: 'success',
+                message: '转出成功',
+                duration:"1000",
+                onClose: () => {
+                  const index = this.landList.findIndex(item => item.id === this.transferLandId);
+                  this.landList.splice(index, 1);
+                }
+              });
+            }
+          });
+        }).catch(() => {
+          // on cancel
+        });
+      },
+      deleteLand(id, index) {
+        this.$dialog.confirm({
+          message: '是否确认取消承包此地块？',
+        }).then(() => {
+          // on confirm
+          deleteCbdkxx(id).then(res => {
+            if (res.code == 200) {
+              this.$toast({
+                icon: 'success',
+                message: '取消成功',
+                duration: "1000",
+                onClose: () => {
+                  this.landList.splice(index, 1);
+                }
+              });
+            }
+          });
+        }).catch(() => {
+          // on cancel
+        });
       }
-
     },
   };
 </script>

src/views/contracted/village/contractor/contractorLandDetail.vue

@@ -1,101 +1,120 @@
 <template>
   <div class="app-container">
 
-    <van-nav-bar left-arrow fixed placeholder @click-left="onClickLeft" >
+    <van-nav-bar left-arrow fixed placeholder @click-left="goBack" >
       <template #title>
         <div class="tb_main">
-<!--          B村<p><span class="tb">签字完成</span><span class="tb">异常挂起</span></p>-->
-          2222
+          {{ titleName }}
         </div>
       </template>
     </van-nav-bar>
 
-    <div class="tap_block">
-      <p @click="$router.push({path:'/contracted/village/contractorDetail'})">承包方</p>
-      <p @click="$router.push({path:'/contracted/village/contractorFamily'})">家庭成员</p>
-      <p @click="$router.push({path:'/contracted/village/contractorWord'})">承包合同</p>
-      <p class="active">承包地</p>
-    </div>
-
     <div class="list_main">
-      <van-field v-model="value" label="地块代码：" placeholder="请输入地块代码" required :border="false" input-align="right" label-width="auto" />
-      <van-field v-model="value" label="地块名称：" placeholder="请输入地块名称" required :border="false" input-align="right" label-width="auto" />
-
-      <van-field v-model="value" label="土地利用类型："
-        placeholder="请选择土地利用类型"
-        required
-        :border="false"
-        input-align="right"
-        right-icon="arrow-down"
-        label-width="auto"
-        readonly
-        clickable
-        @click="showType = true"
-      />
-      <van-popup v-model="showType" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="typeOptions"
-          value-key="dictLabel"
-          @confirm="onConfirmTypeOptions"
-          @cancel="showType = false"
+      <van-form ref="formData">
+        <van-field v-model="form.dkbm" label="地块代码：" placeholder="请选择地块代码" required :rules="[{ required: true }]" :border="false"
+                   input-align="right" right-icon="arrow-down" readonly clickable @click="openLandCodePopup" :disabled="isDisabled" />
+        <van-popup v-model="showLandCode" position="bottom">
+          <van-picker
+            ref="landCodePicker"
+            show-toolbar
+            :columns="landList"
+            @confirm="onConfirmLandCodeOptions"
+            @cancel="showLandCode = false"
+          >
+            <template #option="option">
+              <div style="display: flex; flex-direction: column; align-items: center;">
+                <div>{{option.dkmc}}-{{option.dkbm}}</div>
+              </div>
+            </template>
+          </van-picker>
+        </van-popup>
+        <van-field v-model="form.dkmc" label="地块名称：" placeholder="请输入地块名称" required :rules="[{ required: true }]" :border="false" input-align="right" />
+        <van-field
+          v-model="tdlylxText"
+          label="土地利用类型："
+          placeholder="请选择土地利用类型"
+          required
+          :rules="[{ required: true }]"
+          :border="false"
+          input-align="right"
+          right-icon="arrow-down"
+          readonly
+          clickable
+          @click="showLandUseType = true"
         />
-      </van-popup>
-
-      <van-field v-model="value" label="地力等级："
-        placeholder="请选择地力等级"
-        required
-        :border="false"
-        input-align="right"
-        right-icon="arrow-down"
-        label-width="auto"
-        readonly
-        clickable
-        @click="showZjType = true"
-      />
-      <van-popup v-model="showZjType" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="zjTypeOptions"
-          value-key="dictLabel"
-          @confirm="onConfirmZjTypeOptions"
-          @cancel="showZjType = false"
+        <van-popup v-model="showLandUseType" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="tdlylxOptions"
+            value-key="dictLabel"
+            @confirm="onConfirmLandUseTypeOptions"
+            @cancel="showLandUseType = false"
+          />
+        </van-popup>
+        <van-field
+          v-model="dldjText"
+          label="地力等级："
+          placeholder="请选择地力等级"
+          required
+          :rules="[{ required: true }]"
+          :border="false"
+          input-align="right"
+          right-icon="arrow-down"
+          readonly
+          clickable
+          @click="showLandGrade = true"
         />
-      </van-popup>
-
-      <van-field v-model="value" label="土地用途："
-        placeholder="请选择土地用途"
-        required
-        :border="false"
-        input-align="right"
-        right-icon="arrow-down"
-        label-width="auto"
-        readonly
-        clickable
-        @click="showTDYT = true"
-      />
-      <van-popup v-model="showTDYT" position="bottom">
-        <van-picker
-          show-toolbar
-          :columns="TDYTOptions"
-          value-key="dictLabel"
-          @confirm="onConfirmTDYTOptions"
-          @cancel="showTDYT = false"
+        <van-popup v-model="showLandGrade" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="dldjOptions"
+            value-key="dictLabel"
+            @confirm="onConfirmLandGradeOptions"
+            @cancel="showLandGrade = false"
+          />
+        </van-popup>
+        <van-field
+          v-model="tdytText"
+          label="土地用途："
+          placeholder="请选择土地用途"
+          required
+          :rules="[{ required: true }]"
+          :border="false"
+          input-align="right"
+          right-icon="arrow-down"
+          readonly
+          clickable
+          @click="showLandPurpose = true"
         />
-      </van-popup>
-
-      <van-field v-model="value" label="基本农用：" placeholder="请输入基本农用" required :border="false" input-align="right" label-width="auto" />
-      <van-field v-model="value" label="实测面积(亩)：" placeholder="请输入实测面积(亩)" required :border="false" input-align="right" label-width="auto" />
-      <van-field v-model="value" label="指界：" placeholder="请输入指界" required :border="false" input-align="right" label-width="auto" />
-      <van-field v-model="value" label="东面：" placeholder="请输入东面" required :border="false" input-align="right" label-width="auto" />
-      <van-field v-model="value" label="西面：" placeholder="请输入西面" required :border="false" input-align="right" label-width="auto" />
-      <van-field v-model="value" label="南面：" placeholder="请输入南面" required :border="false" input-align="right" label-width="auto" />
-      <van-field v-model="value" label="北面：" placeholder="请输入北面" required :border="false" input-align="right" label-width="auto" />
-      <van-field v-model="value" label="备注：" placeholder="请输入备注" required :border="false" input-align="right" label-width="auto" />
-
-      <div class="mapBox"></div>
-
-      <p class="btn">保存</p>
+        <van-popup v-model="showLandPurpose" position="bottom">
+          <van-picker
+            show-toolbar
+            :columns="tdytOptions"
+            value-key="dictLabel"
+            @confirm="onConfirmTDYTOptions"
+            @cancel="showLandPurpose = false"
+          />
+        </van-popup>
+        <van-field v-model="form.sfjbnt" label="基本农田：" placeholder="请选择基本农田" required :rules="[{ required: true }]" :border="false" input-align="right">
+          <template #input>
+            <van-radio-group v-model="form.sfjbnt" direction="horizontal">
+              <van-radio v-for="item in sfjbntOptions" :key="item.dictValue" :name="item.dictValue">{{ item.dictLabel }}</van-radio>
+            </van-radio-group>
+          </template>
+        </van-field>
+        <van-field v-model="form.htmjm" type="number" label="合同面积(亩)：" placeholder="请输入合同面积(亩)" required :rules="[{ required: true }]" :border="false" input-align="right" />
+        <van-field v-model="form.zjrxm" label="指界人姓名：" placeholder="请输入指界人姓名" required :rules="[{ required: true }]" :border="false" input-align="right" />
+        <van-field v-model="form.dkdz" label="地块东至：" placeholder="请输入地块东至" required :rules="[{ required: true }]" :border="false" input-align="right" />
+        <van-field v-model="form.dkxz" label="地块西至：" placeholder="请输入地块西至" required :rules="[{ required: true }]" :border="false" input-align="right" />
+        <van-field v-model="form.dknz" label="地块南至：" placeholder="请输入地块南至" required :rules="[{ required: true }]" :border="false" input-align="right" />
+        <van-field v-model="form.dkbz" label="地块北至：" placeholder="请输入地块北至" required :rules="[{ required: true }]" :border="false" input-align="right" />
+        <van-field v-model="form.dkbzxx" label="地块备注信息：" placeholder="请输入地块备注信息" :border="false" input-align="right" />
+
+        <div class="mapBox">
+          <common-map ref="contractedLandMap" :minMapZoom="15" :maxMapZoom="18" :allowDraw="true" @drawFinished="onMapDrawFinished" />
+        </div>
+      </van-form>
+      <p class="btn" @click="submitForm">保存</p>
     </div>
 
 
@@ -103,54 +122,223 @@
 </template>
 <script>
   import Cookies from "js-cookie";
+  import { getCbdkxx, addCbdkxx, updateCbdkxx } from "@/api/contracted/cbdkxx";
+  import { listDk } from "@/api/contracted/dk";
+  import { getDept } from "@/api/contracted";
+  import CommonMap from "@/components/house/CommonMap";
+
   export default {
     name: "contractedVillageContractor",
+    components: {
+      CommonMap
+    },
     data() {
       return {
-        loading:false,
-        finished:true,
-        value:'',
-        showType:false,
-        showZjType:false,
-        showTDYT:false,
-        typeOptions:[{
-          dictLabel:'类型1',
-          dictValue:'1',
-        }],
-        zjTypeOptions:[{
-          dictLabel:'类型2',
-          dictValue:'1',
-        }],
-        TDYTOptions:[{
-          dictLabel:'类型2',
-          dictValue:'1',
-        }],
-        radio:1,
-        minDate: new Date(2020, 0, 1),
-        maxDate: new Date(2025, 10, 1),
-        currentDate: new Date(2021, 0, 17),
+        titleName: '',                    // 标题信息
+        isDisabled: false,                // 是否禁用
+        form: {},                         // 承包地信息表单
+        showLandCode: false,              // 控制地块代码弹出层的显示和隐藏
+        tdlylxOptions: [],                // 土地利用类型字典
+        tdlylxText: null,                 // 土地利用类型标签名
+        showLandUseType: false,           // 控制土地利用类型字典弹出层的显示和隐藏
+        dldjOptions: [],                  // 地力等级字典
+        dldjText: null,                   // 地力等级标签名
+        showLandGrade: false,             // 控制地力等级字典弹出层的显示和隐藏
+        tdytOptions: [],                  // 土地用途字典
+        tdytText: null,                   // 土地用途标签名
+        showLandPurpose: false,           // 控制土地用途字典弹出层的显示和隐藏
+        sfjbntOptions: [],                // 是否基本农田字典
+        landList: [],                     // 地块信息列表
       };
     },
     created() {
-
+      this.getDicts("land_use").then(response => {
+        this.tdlylxOptions = response.data;
+      });
+      this.getDicts("land_grade").then(response => {
+        this.dldjOptions = response.data;
+      });
+      this.getDicts("use_code").then(response => {
+        this.tdytOptions = response.data;
+      });
+      this.getDicts("is_common").then(response => {
+        this.sfjbntOptions = response.data;
+      });
+      if (this.$route.params.id) {
+        this.titleName = '修改承包地信息';
+        this.isDisabled = true;
+        this.getDetail();
+      } else {
+        this.titleName = '新增承包地信息';
+        this.resetForm();
+        this.getCoordinates();
+        this.getLandList();
+      }
     },
     methods: {
-      getList(){
-
+      getCoordinates() {
+        getDept(this.$route.params.deptId).then(response => {
+          const lng = response.data.lng;
+          const lat = response.data.lat;
+          if (lng && lat) {
+            this.$nextTick(() => {
+              this.$refs.contractedLandMap.setCoord(lng, lat);
+            });
+          }
+        });
       },
-      onSearch(){
-
+      getLandList() {
+        // 查询出非承包地块(dklb != '10')且未流转(dkzt = '1')的地块信息
+        listDk({deptId: this.$route.params.deptId, jtdklb: '10', dkzt: '1'}).then(response => {
+          this.landList = response.rows;
+        });
       },
-      onConfirmTypeOptions(){
-
+      getDetail(){
+        getCbdkxx(this.$route.params.id).then(response => {
+          this.form = response.data;
+          this.tdlylxText = this.selectDictLabel(this.tdlylxOptions, response.data.tdlylx);
+          this.dldjText = this.selectDictLabel(this.dldjOptions, response.data.dldj);
+          this.tdytText = this.selectDictLabel(this.tdytOptions, response.data.tdyt);
+          if (response.data.theGeomJson) {
+            this.form.theGeom = JSON.stringify(JSON.parse(response.data.theGeomJson).coordinates);
+            this.$nextTick(() => {
+              this.$refs.contractedLandMap.setLayer('_Draw_layer', response.data.theGeomJson);
+            });
+          } else {
+            this.getCoordinates();
+          }
+        });
       },
-      onConfirmZjTypeOptions(){
-
+      resetForm() {
+        this.form = {
+          deptId: null,
+          cbfbm: null,
+          dkbm: null,
+          dkmc: null,
+          tdlylx: null,
+          dldj: null,
+          tdyt: null,
+          sfjbnt: null,
+          htmjm: null,
+          zjrxm: null,
+          dkdz: null,
+          dkxz: null,
+          dknz: null,
+          dkbz: null,
+          dkbzxx: null,
+          theGeom: null
+        };
       },
-      onConfirmTDYTOptions(){
-
+      openLandCodePopup() {
+        /* if (this.form.dkbm) {
+          const index = this.landList.findIndex(item => item.dkbm === this.form.dkbm);
+          this.$refs.landCodePicker.setColumnIndex(0, index);
+        } */
+        if (!this.isDisabled) {
+          this.showLandCode = true;
+        }
+      },
+      onConfirmLandCodeOptions(value) {
+        this.form.dkbm = value.dkbm;
+        this.form.dkmc = value.dkmc;
+        this.form.tdlylx = value.tdlylx;
+        this.tdlylxText = this.selectDictLabel(this.tdlylxOptions, value.tdlylx);
+        this.form.dldj = value.dldj;
+        this.dldjText = this.selectDictLabel(this.dldjOptions, value.dldj);
+        this.form.tdyt = value.tdyt
+        this.tdytText = this.selectDictLabel(this.tdytOptions, value.tdyt);
+        this.form.sfjbnt = value.sfjbnt;
+        this.form.htmjm = value.scmjm;
+        this.form.zjrxm = value.zjrxm;
+        this.form.dkdz = value.dkdz;
+        this.form.dkxz = value.dkxz
+        this.form.dknz = value.dknz;
+        this.form.dkbz = value.dkbz;
+        this.form.dkbzxx = value.dkbzxx;
+        if (value.theGeomJson) {
+          this.form.theGeom = JSON.stringify(JSON.parse(value.theGeomJson).coordinates);
+          this.$refs.contractedLandMap.setLayer('_Draw_layer', value.theGeomJson);
+        } else {
+          this.form.theGeom = null;
+        }
+        this.showLandCode = false;
+      },
+      onConfirmLandUseTypeOptions(value) {
+        this.form.tdlylx = value.dictValue;
+        this.tdlylxText = value.dictLabel;
+        this.showLandUseType = false;
+      },
+      onConfirmLandGradeOptions(value) {
+        this.form.dldj = value.dictValue;
+        this.dldjText = value.dictLabel;
+        this.showLandGrade = false;
+      },
+      onConfirmTDYTOptions(value){
+        this.form.tdyt = value.dictValue;
+        this.tdytText = value.dictLabel;
+        this.showLandPurpose = false;
+      },
+      goBack() {
+        this.$router.push({
+          name: 'contractedVillageContractorLand',
+          params: {
+            deptId: this.$route.params.deptId,
+            cbfbm: this.$route.params.cbfbm,
+            cbfmc: this.$route.params.cbfmc,
+            surveyStatus: this.$route.params.surveyStatus
+          }
+        });
+      },
+      submitForm() {
+        this.$refs.formData.validate().then(() => {
+          if (this.$route.params.id) {
+            updateCbdkxx(this.form).then(response => {
+              if (response.code == 200) {
+                this.$toast({
+                  icon: 'success',
+                  message: '保存成功',
+                  duration:"1000",
+                  onClose: () => {
+                    this.goBack();
+                  }
+                });
+              }
+            });
+            /* updateJtcy(this.form).then(response => {
+              if (response.code == 200) {
+                this.$toast({
+                  icon: 'success',
+                  message: '保存成功',
+                  duration:"1000",
+                  onClose: () => {
+                    this.goBack();
+                  }
+                });
+              }
+            }); */
+          } else {
+            this.form.deptId = this.$route.params.deptId;
+            this.form.cbfbm = this.$route.params.cbfbm;
+            addCbdkxx(this.form).then(response => {
+              if (response.code == 200) {
+                this.$toast({
+                  icon: 'success',
+                  message: '保存成功',
+                  duration:"1000",
+                  onClose: () => {
+                    this.goBack();
+                  }
+                });
+              }
+            });
+          }
+        }).catch(() => {
+          this.$notify({ type: 'danger', message: '请填写完整的表单项' });
+        });
+      },
+      onMapDrawFinished(data) {
+        this.form.theGeom = JSON.stringify(data);
       },
-
     },
   };
 </script>
@@ -188,6 +376,14 @@
     overflow: initial;
   }
 
+  /deep/ .van-field--disabled .van-field__label {
+    color: #646566;
+  }
+
+  /deep/ .van-field__label {
+    width: 7em;
+  }
+
   .tb_main{
     position: relative;
     p{

src/views/contracted/village/contractor/contractorLandMap.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
 
-    <van-nav-bar left-arrow fixed placeholder @click-left="onClickLeft" >
+    <van-nav-bar left-arrow fixed placeholder @click-left="goBack" >
       <template #title>
         <div class="tb_main">
 <!--          B村<p><span class="tb">签字完成</span><span class="tb">异常挂起</span></p>-->
@@ -10,12 +10,12 @@
       </template>
     </van-nav-bar>
 
-    <div class="tap_block">
+    <!-- <div class="tap_block">
       <p @click="$router.push({path:'/contracted/village/contractorDetail'})">承包方</p>
       <p @click="$router.push({path:'/contracted/village/contractorFamily'})">家庭成员</p>
       <p @click="$router.push({path:'/contracted/village/contractorWord'})">承包合同</p>
       <p class="active">承包地</p>
-    </div>
+    </div> -->
 
     <div class="mapBox"></div>
 
@@ -34,7 +34,17 @@
 
     },
     methods: {
-
+      goBack() {
+        this.$router.push({
+          name: 'contractedVillageContractorLand',
+          params: {
+            deptId: this.$route.params.deptId,
+            cbfbm: this.$route.params.cbfbm,
+            cbfmc: this.$route.params.cbfmc,
+            surveyStatus: this.$route.params.surveyStatus
+          }
+        });
+      },
     },
   };
 </script>