diff --git a/src/api/contracted/cbdkxx.js b/src/api/contracted/cbdkxx.js
new file mode 100644
index 0000000..4369f56
--- /dev/null
+++ b/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
+  });
+}
+
diff --git a/src/api/contracted/cbf.js b/src/api/contracted/cbf.js
new file mode 100644
index 0000000..733afec
--- /dev/null
+++ b/src/api/contracted/cbf.js
@@ -0,0 +1,79 @@
+import request from '@/utils/request';
+
+// 获取承包方列表
+export function listCbf(params) {
+  return request({
+    url: '/service/cbf/list',
+    method: 'get',
+    params: params
+  });
+}
+
+// 获取承包方详情
+export function getCbf(cbfbm) {
+  return request({
+    url: '/service/cbf/obtain/' + cbfbm,
+    method: 'get',
+  });
+}
+
+// 获取承包方详情
+export function getCbfById(id) {
+  return request({
+    url: '/service/cbf/get/' + id,
+    method: 'get'
+  });
+}
+
+// 新增承包方信息
+export function addCbf(data) {
+  return request({
+    url: '/service/cbf/add',
+    method: 'post',
+    data: data
+  });
+}
+
+// 更新承包方信息
+export function updateCbf(data) {
+  return request({
+    url: '/service/cbf/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除承包方信息
+export function deleteCbf(id) {
+  return request({
+    url: '/service/cbf/delete/' + id,
+    method: 'get'
+  });
+}
+
+// 生成承包方编码
+export function generateContractorCode(params) {
+  return request({
+    url: '/service/cbf/generateCode',
+    method: 'get',
+    params: params
+  });
+}
+
+// 承包方调查签字
+export function contractorSignature(data) {
+  return request({
+    url: '/service/cbf/surveySign',
+    method: 'post',
+    data: data
+  });
+}
+
+// 调查挂起
+export function hangUp(data) {
+  return request({
+    url: '/service/cbf/hangUp',
+    method: 'post',
+    data: data
+  });
+}
diff --git a/src/api/contracted/cbfjtcy.js b/src/api/contracted/cbfjtcy.js
new file mode 100644
index 0000000..9e7144b
--- /dev/null
+++ b/src/api/contracted/cbfjtcy.js
@@ -0,0 +1,70 @@
+import request from '@/utils/request';
+
+// 查询承包方家庭成员列表
+export function listJtcy(params) {
+  return request({
+    url: '/service/jtcy/list',
+    method: 'get',
+    params: params
+  });
+}
+
+// 查询承包方家庭成员详细
+export function getJtcy(id) {
+  return request({
+    url: '/service/jtcy/get/' + id,
+    method: 'get'
+  });
+}
+
+// 新增承包方家庭成员信息
+export function addJtcy(data) {
+  return request({
+    url: '/service/jtcy/add',
+    method: 'post',
+    data: data
+  });
+}
+
+// 修改承包方家庭成员信息
+export function updateJtcy(data) {
+  return request({
+    url: '/service/jtcy/edit',
+    method: 'post',
+    data: data
+  });
+}
+
+// 删除承包方家庭成员信息
+export function deleteJtcy(id) {
+  return request({
+    url: '/service/jtcy/remove/' + id,
+    method: 'get'
+  });
+}
+
+// 家庭成员分户
+export function divisionJtcy(id) {
+  return request({
+    url: '/service/jtcy/division/' + id,
+    method: 'get'
+  });
+}
+
+// 家庭成员移户
+export function transferJtcy(params) {
+  return request({
+    url: '/service/jtcy/transfer',
+    method: 'get',
+    params: params
+  });
+}
+
+// 家庭成员设为户主
+export function setHouseholder(id) {
+  return request({
+    url: '/service/jtcy/householder/' + id,
+    method: 'get'
+  });
+}
+
diff --git a/src/api/contracted/cbht.js b/src/api/contracted/cbht.js
new file mode 100644
index 0000000..8c1b386
--- /dev/null
+++ b/src/api/contracted/cbht.js
@@ -0,0 +1,35 @@
+import request from '@/utils/request';
+
+// 获取承包合同详情
+export function getCbht(cbfbm) {
+  return request({
+    url: '/service/cbht/obtain/' + cbfbm,
+    method: 'get'
+  });
+}
+
+// 新增承包合同信息
+export function addCbht(data) {
+  return request({
+    url: '/service/cbht/insert',
+    method: 'post',
+    data: data
+  });
+}
+
+// 修改承包合同信息
+export function updateCbht(data) {
+  return request({
+    url: '/service/cbht/edit',
+    method: 'post',
+    data: data
+  });
+}
+
+// 承包合同延期
+export function extendCbht(id) {
+  return request({
+    url: '/service/cbht/extension/' + id,
+    method: 'get'
+  });
+}
diff --git a/src/api/contracted/dk.js b/src/api/contracted/dk.js
new file mode 100644
index 0000000..8f5b92b
--- /dev/null
+++ b/src/api/contracted/dk.js
@@ -0,0 +1,54 @@
+import request from '@/utils/request';
+
+// 地块信息列表
+export function listDk(params) {
+  return request({
+    url: '/service/dk/list',
+    method: 'get',
+    params: params
+  });
+}
+
+// 地块信息详情
+export function getDk(id) {
+  return request({
+    url: '/service/dk/get/' + id,
+    method: 'get'
+  });
+}
+
+// 新增地块属性信息
+export function addDk(data) {
+  return request({
+    url: '/service/dk/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改地块属性信息
+export function updateDk(data) {
+  return request({
+    url: '/service/dk/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除地块信息
+export function deleteDk(id) {
+  return request({
+    url: '/service/dk/remove/' + id,
+    method: 'get'
+  });
+}
+
+
+// 生成地块编码
+export function generateLandCode(params) {
+  return request({
+    url: '/service/dk/generateCode',
+    method: 'get',
+    params: params
+  });
+}
diff --git a/src/api/contracted/fbf.js b/src/api/contracted/fbf.js
new file mode 100644
index 0000000..93a5ef4
--- /dev/null
+++ b/src/api/contracted/fbf.js
@@ -0,0 +1,54 @@
+import request from '@/utils/request';
+
+// 获取承包方列表
+export function listFbf(params) {
+  return request({
+    url: '/service/fbf/list',
+    method: 'get',
+    params: params
+  });
+}
+
+// 新增发包方信息
+export function addFbf(data) {
+  return request({
+    url: '/service/fbf/add',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改发包方信息
+export function updateFbf(data) {
+  return request({
+    url: '/service/fbf/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 发包方调查签字
+export function manualSignature(data) {
+  return request({
+    url: '/service/fbf/surveySign',
+    method: 'post',
+    data: data
+  });
+}
+
+// 生成发包方编码
+export function generateEmployerCode(params) {
+  return request({
+    url: '/service/fbf/generateCode',
+    method: 'get',
+    params: params
+  });
+}
+
+// 发包方签字授权
+  export function authorizeSignature(id) {
+  return request({
+    url: '/service/fbf/authorize/' + id,
+    method: 'get'
+  });
+}
diff --git a/src/api/contracted/index.js b/src/api/contracted/index.js
new file mode 100644
index 0000000..3dc123b
--- /dev/null
+++ b/src/api/contracted/index.js
@@ -0,0 +1,18 @@
+import request from '@/utils/request';
+
+// 根据deptId获取部门信息
+export function getDept(deptId) {
+  return request({
+    url: '/system/dept/get/' + deptId,
+    method: 'get'
+  });
+}
+
+// 获取确权调查任务列表
+export function listSurveyTask(params) {
+  return request({
+    url: '/service/landsurvey/mobile/list',
+    method: 'get',
+    params: params
+  });
+}
diff --git a/src/api/system/config.js b/src/api/system/config.js
index a404d82..85df3dc 100644
--- a/src/api/system/config.js
+++ b/src/api/system/config.js
@@ -58,3 +58,11 @@ export function refreshCache() {
     method: 'delete'
   })
 }
+
+// 根据参数键名查询参数值
+// export function getConfigKey(configKey) {
+//   return request({
+//     url: '/open/typz/configKey/' + configKey,
+//     method: 'get'
+//   })
+// }
diff --git a/src/assets/images/app/1.png b/src/assets/images/app/1.png
new file mode 100644
index 0000000..8959037
Binary files /dev/null and b/src/assets/images/app/1.png differ
diff --git a/src/assets/images/app/2.png b/src/assets/images/app/2.png
new file mode 100644
index 0000000..f1c30e7
Binary files /dev/null and b/src/assets/images/app/2.png differ
diff --git a/src/assets/images/app/edit.png b/src/assets/images/app/edit.png
new file mode 100644
index 0000000..4fd0577
Binary files /dev/null and b/src/assets/images/app/edit.png differ
diff --git a/src/permission.js b/src/permission.js
index 60e7bba..72760bc 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -9,7 +9,7 @@ import { isRelogin } from '@/utils/request'
 
 NProgress.configure({ showSpinner: false })
 
-const whiteList = ['/login', '/register', '/app/login', '/app/list', '/app/edit']
+const whiteList = ['/login', '/register', '/app/login', '/app/list', '/app/edit', '/app/map']
 
 const isWhiteList = (path) => {
   return whiteList.some(pattern => isPathMatch(pattern, path))
diff --git a/src/router/index.js b/src/router/index.js
index 0c33514..fce72a4 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -87,7 +87,61 @@ export const constantRoutes = [
         meta: { title: '个人中心', icon: 'user' }
       }
     ]
-  }
+  },
+  { //登录页
+    path: '/app/login',
+    name: 'appLogin',
+    hidden: true,
+    meta: {
+      title: '登录',
+    },
+    component: (resolve) => require(['@/views/app/login'], resolve)
+  },
+  { //首页
+    path: '/app/index',
+    name: 'appIndex',
+    hidden: true,
+    meta: {
+      title: '首页',
+    },
+    component: (resolve) => require(['@/views/app/index'], resolve)
+  },
+  { //用户页
+    path: '/app/user',
+    name: 'appUser',
+    hidden: true,
+    meta: {
+      title: '首页',
+    },
+    component: (resolve) => require(['@/views/app/user'], resolve)
+  },
+  { //用户页
+    path: '/app/list',
+    name: 'appList',
+    hidden: true,
+    meta: {
+      title: '列表',
+    },
+    component: (resolve) => require(['@/views/app/list'], resolve)
+  },
+  { //用户页
+    path: '/app/edit',
+    name: 'appEdit',
+    hidden: true,
+    meta: {
+      title: '修改',
+    },
+    component: (resolve) => require(['@/views/app/edit'], resolve)
+  },
+  { //用户页
+    path: '/app/map',
+    name: 'appMap',
+    hidden: true,
+    meta: {
+      title: '地图',
+    },
+    component: (resolve) => require(['@/views/app/map'], resolve)
+  },
 ]
 
 // 动态路由，基于用户权限动态去加载
@@ -175,61 +229,7 @@ export const dynamicRoutes = [
         meta: { title: '修改生成配置', activeMenu: '/tool/gen' }
       }
     ]
-  },
-  { //登录页
-    path: '/app/login',
-    name: 'appLogin',
-    meta: {
-      title: '登录',
-      hidden: true,
-    },
-    component: (resolve) => require(['@/views/app/login'], resolve)
-  },
-  { //首页
-    path: '/app/index',
-    name: 'appIndex',
-    meta: {
-      title: '首页',
-      hidden: true,
-    },
-    component: (resolve) => require(['@/views/app/index'], resolve)
-  },
-  { //用户页
-    path: '/app/user',
-    name: 'appUser',
-    meta: {
-      title: '首页',
-      hidden: true,
-    },
-    component: (resolve) => require(['@/views/app/user'], resolve)
-  },
-  { //用户页
-    path: '/app/list',
-    name: 'appList',
-    meta: {
-      title: '列表',
-      hidden: true,
-    },
-    component: (resolve) => require(['@/views/app/list'], resolve)
-  },
-  { //用户页
-    path: '/app/edit',
-    name: 'appEdit',
-    meta: {
-      title: '修改',
-      hidden: true,
-    },
-    component: (resolve) => require(['@/views/app/edit'], resolve)
-  },
-  { //用户页
-    path: '/app/map',
-    name: 'appMap',
-    meta: {
-      title: '地图',
-      hidden: true,
-    },
-    component: (resolve) => require(['@/views/app/map'], resolve)
-  },
+  }
 ]
 
 // 防止连续点击多次路由报错
diff --git a/src/views/app/index.vue b/src/views/app/index.vue
index e34dbbf..fe8b531 100644
--- a/src/views/app/index.vue
+++ b/src/views/app/index.vue
@@ -18,28 +18,12 @@
           <p slot="left-icon" class="notice_tt">通知</p>
       </van-notice-bar>
 
-      <div class="content">
-        <p class="title">服务功能</p>
+      <div class="content" v-for="(item,index) in menuList" :key="index">
+        <p class="title">{{item.modelType}}</p>
         <div class="flex-main">
-          <div>
-            <img src="../../assets/images/app/user_header.png" alt="">
-            <p>地图管理</p>
-          </div>
-          <div>
-            <img src="../../assets/images/app/user_header.png" alt="">
-            <p>地图管理</p>
-          </div>
-          <div>
-            <img src="../../assets/images/app/user_header.png" alt="">
-            <p>地图管理</p>
-          </div>
-          <div>
-            <img src="../../assets/images/app/user_header.png" alt="">
-            <p>地图管理</p>
-          </div>
-          <div>
-            <img src="../../assets/images/app/user_header.png" alt="">
-            <p>地图管理</p>
+          <div v-for="(itemChild,indexChild) in item.menus" :key="indexChild" @click="$router.push({path:itemChild.menuUrl})">
+            <img :src="require('@/assets/images/app/' + itemChild.menuIcon)" alt="">
+            <p>{{itemChild.menuName}}</p>
           </div>
         </div>
       </div>
@@ -54,7 +38,7 @@
     name: "appIndex",
     data() {
       return {
-
+        menuList:[]
       };
     },
     created() {
@@ -63,7 +47,7 @@
     methods: {
       getMenuApp(){
         getMenuApp().then((res) => {
-
+          this.menuList = res.data;
         });
       }
     },
diff --git a/src/views/app/list.vue b/src/views/app/list.vue
index 5b0b545..35aea5e 100644
--- a/src/views/app/list.vue
+++ b/src/views/app/list.vue
@@ -25,7 +25,7 @@
         >
           <!--1-->
           <van-swipe-cell right-width="200" class="item" v-for="(item,index) in 10" :key="index">
-            <div class="item_box" @click="$router.push({name:'',query:{id:item.id}})">
+            <div class="item_box" @click="$router.push({name:'appEdit',query:{id:item.id}})">
               <div class="head_block">
                 <div class="title">334656556565</div>
                 <div class="describe">已清查</div>
@@ -217,6 +217,7 @@
       flex-shrink: 0;
       background: linear-gradient( 271deg, #53E4A5 0%, #24DBDB 100%);
       border: none;
+      width: 20%;
     }
   }
 
diff --git a/src/views/app/map.vue b/src/views/app/map.vue
index e4ec4be..76b83fb 100644
--- a/src/views/app/map.vue
+++ b/src/views/app/map.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="home_wrapper">
+  <div class="app-container">
     <van-nav-bar
       title="土地列表管理"
       left-arrow
@@ -7,206 +7,846 @@
       safe-area-inset-top
       @click-left="onClickLeft"
     />
-
-      <div class="search_box">
-        <div class="left">
-          <p>已清查<van-icon name="play" /></p>
-          <van-field v-model="value" left-icon="search" placeholder="请输入用户名" />
+    <div class="search_box">
+      <div class="left">
+        <van-field v-model="value" left-icon="search" placeholder="请输入用户名" />
+      </div>
+      <van-button type="primary" round >搜索</van-button>
+    </div>
+    <div style="position:relative;">
+      <div class="mapBox" id="landMapBox"></div>
+      <div class="legend_main" v-if="showLegend">
+<!--        <div class="legend">-->
+<!--          <p class="legend_tt">图例-->
+<!--&lt;!&ndash;            <img src="../../../../../static/images/contracted/map_icon_01.png" @click="showLegend = false" alt="">&ndash;&gt;-->
+<!--          </p>-->
+<!--          <van-checkbox-group v-model="landCategory" @change="filterLandLayer">-->
+<!--            <van-checkbox name="10" shape="square" checked-color="#16e90f" icon-size="18px"><div><p>承包地</p><i class="i1"></i></div></van-checkbox>-->
+<!--            <van-checkbox name="21" shape="square" checked-color="#01c6de" icon-size="18px"><div><p>自留地</p><i class="i2"></i></div></van-checkbox>-->
+<!--            <van-checkbox name="22" shape="square" checked-color="#eeee00" icon-size="18px"><div><p>机动地</p><i class="i3"></i></div></van-checkbox>-->
+<!--            <van-checkbox name="23" shape="square" checked-color="#ee3c3c" icon-size="18px"><div><p>开荒地</p><i class="i4"></i></div></van-checkbox>-->
+<!--            <van-checkbox name="99" shape="square" checked-color="#eb8600" icon-size="18px"><div><p>其他地</p><i class="i5"></i></div></van-checkbox>-->
+<!--          </van-checkbox-group>-->
+<!--        </div>-->
+        <div class="legend_second" v-if="taskStatus === '2'">
+          <p class="legend_tt" id="drawLandPolygon">
+<!--            <img src="../../../../../static/images/contracted/map_icon_02.png" alt="">画图-->
+          </p>
         </div>
-        <van-button type="primary" round >搜索</van-button>
       </div>
-
-      <div class="list_main">
-        <van-list
-          v-model="loading"
-          :finished="finished"
-          finished-text="没有更多了"
-          @load="getList"
-        >
-          <!--1-->
-          <van-swipe-cell right-width="200" class="item" v-for="(item,index) in 10" :key="index">
-            <div class="item_box" @click="$router.push({name:'',query:{id:item.id}})">
-              <div class="head_block">
-                <div class="title">334656556565</div>
-                <div class="describe">已清查</div>
-              </div>
-              <div class="order_block">
-                <div class="order">名称名称名称名称名称名</div>
-                <div class="describe">67.08</div>
-              </div>
-            </div>
-            <template #right>
-              <div style="background-color: #29D2AF;height: 100%">属性<br/>修改</div>
-              <div style="background-color: #0E82EB;height: 100%">经营<br/>修改</div>
-              <div style="background-color: #ee0a24;height: 100%">删除</div>
-            </template>
-          </van-swipe-cell>
-
-        </van-list>
+      <div class="openLegend" v-if="!showLegend" @click="showLegend = true">
+        <span class="sanjiao-left"></span>
       </div>
-
     </div>
-</template>
 
+
+      <van-popup v-model="open" position="bottom" round >
+        <div class="landPopup">
+          <p class="landPopup_title">属性数据 <img src="../../assets/images/app/edit.png" width="25" alt=""></p>
+          <van-form ref="landForm">
+            <van-field v-model="form.dkbm" label="地块代码：" placeholder="<自动生成>" :border="false" input-align="right" label-width="auto" maxlength="19" :disabled="true" >
+              <!-- <template #button v-if="!isDisabled">
+                <van-button size="mini" type="primary" native-type="button" @click="generateCode">生成代码</van-button>
+              </template> -->
+            </van-field>
+            <van-field v-model="form.dkmc" label="地块名称：" placeholder="请输入地块名称" required :rules="[{ required: true }]" :border="false" input-align="right" maxlength="50" />
+            <van-field v-model="syqxzText" label="所有权性质："
+                       placeholder="请选择所有权性质"
+                       required
+                       :rules="[{ required: true }]"
+                       :border="false"
+                       input-align="right"
+                       right-icon="arrow-down"
+                       readonly
+                       clickable
+                       @click="showOwnership = true"
+            />
+            <van-popup v-model="showOwnership" position="bottom" get-container=".app-container">
+              <van-picker
+                show-toolbar
+                :columns="syqxzOptions"
+                value-key="dictLabel"
+                @confirm="onConfirmOwnershipOptions"
+                @cancel="showOwnership = false"
+              />
+            </van-popup>
+            <van-field v-model="dklbText" label="地块类别："
+                       placeholder="请选择地块类别"
+                       required
+                       :rules="[{ required: true }]"
+                       :border="false"
+                       input-align="right"
+                       right-icon="arrow-down"
+                       readonly
+                       clickable
+                       @click="openLandCategoryPopup"
+            />
+            <van-popup v-model="showLandCategory" position="bottom" get-container=".app-container">
+              <van-picker
+                show-toolbar
+                :columns="dklbOptions"
+                value-key="dictLabel"
+                @confirm="onConfirmLandCategoryOptions"
+                @cancel="showLandCategory = false"
+              />
+            </van-popup>
+            <van-field v-model="tdlylxText" label="土地利用类型："
+                       placeholder="请选择土地利用类型"
+                       required
+                       :rules="[{ required: true }]"
+                       :border="false"
+                       input-align="right"
+                       right-icon="arrow-down"
+                       readonly
+                       clickable
+                       @click="showLandType = true"
+            />
+            <van-popup v-model="showLandType" position="bottom" get-container=".app-container">
+              <van-picker
+                show-toolbar
+                :columns="tdlylxOptions"
+                value-key="dictLabel"
+                @confirm="onConfirmLandTypeOptions"
+                @cancel="showLandType = 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 v-model="showLandGrade" position="bottom" get-container=".app-container">
+              <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 v-model="showLandPurpose" position="bottom" get-container=".app-container">
+              <van-picker
+                show-toolbar
+                :columns="tdytOptions"
+                value-key="dictLabel"
+                @confirm="onConfirmLandPurposeOptions"
+                @cancel="showLandPurpose = false"
+              />
+            </van-popup>
+            <van-field v-model="form.sfjbnt" label="基本农田：" required :rules="[{ required: true }]" :border="false" input-align="right" >
+              <template #input>
+                <van-radio-group v-model="form.sfjbnt" direction="horizontal">
+                  <!-- <van-radio name="1">是</van-radio>
+                  <van-radio name="2">否</van-radio> -->
+                  <van-radio v-for="dict in sfjbntOptions" :ke="dict.dictValue" :name="dict.dictValue">{{ dict.dictLabel }}</van-radio>
+                </van-radio-group>
+              </template>
+            </van-field>
+            <van-field v-model="form.scmjm" 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" maxlength="100" />
+            <van-field v-model="form.dkdz" label="地块东至：" placeholder="请输入地块东至" required :rules="[{ required: true }]" :border="false" input-align="right" maxlength="50" />
+            <van-field v-model="form.dkxz" label="地块西至：" placeholder="请输入地块西至" required :rules="[{ required: true }]" :border="false" input-align="right" maxlength="50" />
+            <van-field v-model="form.dknz" label="地块南至：" placeholder="请输入地块南至" required :rules="[{ required: true }]" :border="false" input-align="right" maxlength="50" />
+            <van-field v-model="form.dkbz" label="地块北至：" placeholder="请输入地块北至" required :rules="[{ required: true }]" :border="false" input-align="right" maxlength="50" />
+            <van-field v-model="form.dkbzxx" label="地块备注信息：" placeholder="请输入地块备注信息" type="textarea" rows="3" :border="false" input-align="right" maxlength="250" />
+          </van-form>
+          <div class="footer_main">
+            <van-button type="default" hairline size="large" @click="closePopup">关闭弹窗</van-button>
+            <van-button type="danger" hairline size="large" @click="deleteLand(form.id)" v-if="taskStatus === '2' && showDeleteBtn">删除地块</van-button>
+            <van-button type="info" hairline size="large" @click="saveLand" v-if="showSaveBtn">保存信息</van-button>
+          </div>
+        </div>
+      </van-popup>
+
+  </div>
+</template>
 <script>
-  // import { getMenuApp } from "@/api/app/index";
   import Cookies from "js-cookie";
+  import { getConfigKey } from "@/api/system/config";
+  import { getDept } from "@/api/contracted";
+  import { getDk, addDk, updateDk, deleteDk, generateLandCode } from "@/api/contracted/dk";
+  import $ from "jquery";
+
   export default {
-    name: "appMap",
+    name: "contractedVillageContractor",
     data() {
       return {
-        loading: false,
-        finished: false,
+        form: {},                         // 地块信息表单参数
+        map: "",                          // 地图
+        mapGeoServerUrl: "",              // geoserver地址
+        mapCenterLocation: [],            // 地图中心坐标
+        landLayerName: "",                // 地块图层名称
+        landLayer: "",                    // 地块图层
+        mapBorder: "",                    // 地图边界
+        villageBorderLayerName: "",       // 乡镇边界图层名称
+        vectorLayer: "",                  // 绘制的矢量图层
+
+        title: "",                        // 弹出层标题
+        open: true,                      // 是否显示地块弹出层
+        syqxzOptions: [],                 // 所有权性质字典
+        syqxzText: null,                  // 所有权性质标签名
+        showOwnership: false,             // 控制所有权性质字典弹出层的显示和隐藏
+        dklbOptions: [],                  // 地块类别字典
+        dklbText: null,                   // 地块类别标签名
+        showLandCategory: false,          // 控制的地块类别字典弹出层的显示和隐藏
+        dldjOptions: [],                  // 地力等级字典
+        dldjText: null,                   // 地力等级标签名
+        showLandGrade: false,             // 控制地力等级字典弹出层的显示和隐藏
+        tdytOptions: [],                  // 土地用途字典
+        tdytText: null,                   // 土地用途标签名
+        showLandPurpose: false,           // 控制土地用途字典弹出层的显示和隐藏
+        tdlylxOptions: [],                // 土地利用类型
+        tdlylxText: null,                 // 土地利用类型标签名
+        showLandType: false,              // 控制土地利用类型字典弹出层的显示和隐藏
+        sfjbntOptions: [],                // 是否基本农田字典
+        showSaveBtn: false,               // 控制保存按钮的显示隐藏
+        showDeleteBtn: false,             // 控制删除按钮的显示隐藏
+        // isDisabled: false,                // 是否禁用
+        taskStatus: null,                 // 调查任务的完成状态：1表示已完成，2表示未完成
+        landCategory: ['10'],             // 地块类别
+
+        showLegend:true,
         value:''
       };
     },
     created() {
-
+      this.taskStatus = Cookies.get('taskStatus');
+      this.getDicts("land_ownership").then(response => {
+        this.syqxzOptions = response.data;
+      });
+      this.getDicts("land_type").then(response => {
+        this.dklbOptions = response.data;
+        // 去除地块类别中的承包地块选项
+        let index = this.dklbOptions.findIndex(item => item.dictValue === '10');
+        this.dklbOptions.splice(index, 1);
+      });
+      this.getDicts("land_grade").then(response => {
+        this.dldjOptions = response.data;
+      });
+      this.getDicts("use_code").then(response => {
+        this.tdytOptions = response.data;
+      });
+      this.getDicts("land_use").then(response => {
+        this.tdlylxOptions = response.data;
+      });
+      this.getDicts("is_common").then(response => {
+        this.sfjbntOptions = response.data;
+      });
+      // 获取geoserver的地址
+      this.getGeoServerUrl();
+      // 获取地块图层名称
+      this.getLandLayerName();
+      // 获取村边界的图层名称
+      this.getVillageBorderLayerName();
+    },
+    mounted() {
+      // 初始化地图
+      setTimeout(() => {
+        this.initMap();
+      }, 500);
     },
     methods: {
       onClickLeft(){
         history.back(-1);
       },
-      getList(){
+      // 获取geoserver的地址
+      getGeoServerUrl() {
+        getConfigKey("system.geoServer.url").then(response => {
+          this.mapGeoServerUrl = response.msg;
+        });
+      },
+      // 获取地块图层名称
+      getLandLayerName() {
+        getConfigKey("geoserver.layer.resourceLand").then(response => {
+          this.landLayerName = response.msg;
+        });
+      },
+      // 获取村边界的图层名称
+      getVillageBorderLayerName() {
+        getConfigKey("geoserver.layer.villageBorder").then(response => {
+          this.villageBorderLayerName = response.msg;
+        });
+      },
+      // 初始化地图
+      initMap() {
+        // this.$route.query.deptId
+        // getDept(100).then(response => {
+        //   let dept = response.data;
+          let dept = {};
+          if (dept.lng && dept.lat) {
+            this.mapCenterLocation = [dept.lng, dept.lat];
+          } else {
+            this.mapCenterLocation = [116.391458, 39.902377];
+          }
+          document.getElementById("landMapBox").innerHTML = "";
+          // 定义地图投影
+          let projection = new ol.proj.Projection({
+            code: "EPSG:3857",
+            units: "degrees",
+          });
+          // 定义地图图层
+          let aerial = new ol.layer.Tile({
+            source: new ol.source.XYZ({
+              url: "http://t{0-7}.tianditu.com/img_w/wmts?" +
+                "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
+                "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
+            }),
+            isGroup: true,
+            name: "卫星影像图",
+          });
+          let yingxzi = new ol.layer.Tile({
+            source: new ol.source.XYZ({
+              url: "http://t{0-7}.tianditu.com/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
+            }),
+            isGroup: true,
+            name: "天地图文字标注--卫星影像图",
+          });
+          //加载地图
+          this.map = new ol.Map({
+            controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]),
+            layers: [aerial, yingxzi],
+            projection: projection,
+            target: "landMapBox",
+            view: new ol.View({
+              center: ol.proj.fromLonLat(this.mapCenterLocation), // 地图中心坐标
+              zoom: 15.5,
+              minZoom: 1, //地图缩小限制
+              maxZoom: 18, //地图放大限制
+              // extent: [13481224.75161,5667110.83528,13811063.06278,5880284.11416]
+            }),
+          });
+          // // 添加村边界
+          this.addVillageBorder();
+          // 添加地块图层
+          this.addLandLayer();
+          // 绘制地块
+          $("#drawLandPolygon").click(() => {
+            // 创建矢量数据源
+            let vectorSource = new ol.source.Vector({
+              wrapX: false,
+            });
+            // 创建矢量图层
+            this.vectorLayer = new ol.layer.Vector({
+              source: vectorSource,
+            });
+            // 添加图层
+            this.map.addLayer(this.vectorLayer);
+            // 地图交互-绘制图形
+            let drawInteraction = new ol.interaction.Draw({
+              source: vectorSource,
+              type: "Polygon",
+            });
+            // 添加交互
+            this.map.addInteraction(drawInteraction);
+            drawInteraction.on('drawend', (evt) => {
+              // 移除交互
+              this.map.removeInteraction(drawInteraction);
+              let coordinates = evt.feature.getGeometry().getCoordinates();
+              this.reset();
+              this.form.theGeom = JSON.stringify(coordinates);
+              this.title = "添加地块信息";
+              this.showSaveBtn = true;
+              this.showDeleteBtn = false;
+              // this.isDisabled = false;
+              setTimeout(() => {
+                this.open = true;
+              }, 10);
+
+            });
+          });
+          // 地图点击事件
+          this.map.on("click", (evt) => {
+            // 点击宅基地查看详情
+            if (this.landLayer) {
+              const viewResolution = this.map.getView().getResolution();
+              const url = this.landLayer.getSource()
+                .getFeatureInfoUrl(evt.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'application/json'});
+              if (url) {
+                fetch(url)
+                  .then(response => response.json())
+                  .then(data => {
+                    if (data.features.length > 0) {
+                      let id = data.features[0].id.split(".")[1];
+                      getDk(id).then(response => {
+                        const data = response.data;
+                        this.reset();
+                        this.form = data;
+                        this.syqxzText = this.selectDictLabel(this.syqxzOptions, data.syqxz);
+                        if (data.dklb === '10') {
+                          this.dklbText = '承包地块';
+                        } else {
+                          this.dklbText = this.selectDictLabel(this.dklbOptions, data.dklb);
+                        }
+                        this.dldjText = this.selectDictLabel(this.dldjOptions, data.dldj);
+                        this.tdytText = this.selectDictLabel(this.tdytOptions, data.tdyt);
+                        this.tdlylxText = this.selectDictLabel(this.tdlylxOptions, data.tdlylx);
+                        this.title = "查看地块信息";
+                        this.showSaveBtn = false;
+                        this.showDeleteBtn = true;
+                        // this.isDisabled = true;
+                        setTimeout(() => {
+                          this.open = true;
+                        }, 10);
+                      });
 
+                      /* if (this.selectedHomesteadLayer) {
+                        this.map.removeLayer(this.selectedHomesteadLayer);
+                        this.selectedHomesteadLayer = "";
+                      }
+                      this.selectedHomesteadLayer = new ol.layer.Vector({
+                        source: new ol.source.Vector({
+                          features: new ol.format.GeoJSON().readFeatures(data)
+                        }),
+                        name: 'selectedHomesteadLayer',
+                        style: new ol.style.Style({
+                          fill: new ol.style.Fill({
+                            //矢量图层填充颜色，以及透明度
+                            color: "rgba(255, 84, 87, 0.3)",
+                          }),
+                          stroke: new ol.style.Stroke({
+                            //边界样式
+                            color: "#ff5457",
+                            width: 3,
+                          }),
+                        })
+                      });
+                      // this.map.addLayer(this.selectedHomesteadLayer);
+                      this.map.getLayers().insertAt(4, this.selectedHomesteadLayer);*/
+                    }
+                  });
+              }
+            }
+          });
+        // });
+      },
+      filterLandLayer() {
+        if (this.landLayer) {
+          this.map.removeLayer(this.landLayer);
+          this.landLayer = "";
+        }
+        this.addLandLayer();
+      },
+      // 添加地块图层
+      addLandLayer() {
+        this.landLayer = new ol.layer.Image({
+          source: new ol.source.ImageWMS({
+            url: this.mapGeoServerUrl + '/wms',
+            params: {
+              LAYERS: this.landLayerName,
+              cql_filter: "dept_id = '" + this.$route.query.deptId + "' and DKLB in (" + this.landCategory + ")",
+              SRID: 3857,
+              abc: Math.random()        // 无效参数，保证每次发送的请求都不一样
+            }
+          }),
+          name: 'landLayer'
+        });
+        this.map.getLayers().insertAt(3, this.landLayer);
+        // this.map.addLayer(this.landLayer);
+      },
+      // 添加村边界
+      addVillageBorder() {
+        this.mapBorder = new ol.layer.Image({
+          source: new ol.source.ImageWMS({
+            url: this.mapGeoServerUrl + '/wms',
+            params: {
+              LAYERS: this.villageBorderLayerName,
+              cql_filter: "dept_id = '" + this.$route.query.deptId + "'",
+              SRID: 3857,
+            },
+          }),
+          name: 'villageBorderLayer'
+        });
+        this.map.getLayers().insertAt(2, this.mapBorder);
+      },
+      saveLand() {
+        this.$refs.landForm.validate().then(() => {
+          if (this.form.id) {
+            this.showSaveBtn = false;
+            updateDk(this.form).then(response => {
+              if (response.code == 200) {
+                this.$toast({
+                  icon: 'success',
+                  message: '保存成功',
+                  duration:"1000",
+                  onClose: () => {
+                    this.open = false;
+                    this.showSaveBtn = true;
+                  }
+                });
+              }
+            });
+          } else {
+            this.form.deptId = this.$route.query.deptId;
+            this.showSaveBtn = false;
+            addDk(this.form).then(response => {
+              if (response.code == 200) {
+                this.$toast({
+                  icon: 'success',
+                  message: '保存成功',
+                  duration:"1000",
+                  onClose: () => {
+                    this.open = false;
+                    this.showSaveBtn = true;
+                    // 移除矢量图层
+                    this.map.removeLayer(this.vectorLayer);
+                    this.vectorLayer = "";
+                    // 移除地块图层重新加载
+                    this.map.removeLayer(this.landLayer);
+                    this.landLayer = "";
+                    this.addLandLayer();
+                  }
+                });
+              }
+            });
+          }
+        }).catch(() => {
+          this.$notify({ type: 'danger', message: '请填写完整的表单项' });
+        });
+      },
+      deleteLand(id) {
+        this.$dialog.confirm({
+          message: '是否确认删除此地块？',
+        }).then(() => {
+          // on confirm
+          this.showDeleteBtn = false;
+          deleteDk(id).then(res => {
+            if (res.code == 200) {
+              this.$toast({
+                icon: 'success',
+                message: '删除成功',
+                duration: "1000",
+                onClose: () => {
+                  this.open = false;
+                  this.showDeleteBtn = true;
+                  // 移除地块图层重新加载
+                  this.map.removeLayer(this.landLayer);
+                  this.landLayer = "";
+                  this.addLandLayer();
+                }
+              });
+            }
+          });
+        }).catch(() => {
+          // on cancel
+        });
+      },
+      onConfirmOwnershipOptions(value){
+        this.form.syqxz = value.dictValue;
+        this.syqxzText = value.dictLabel;
+        this.showOwnership = false;
+      },
+      onConfirmLandCategoryOptions(value){
+        this.form.dklb = value.dictValue;
+        this.dklbText = value.dictLabel;
+        this.showLandCategory = false;
+      },
+      onConfirmLandTypeOptions(value) {
+        this.form.tdlylx = value.dictValue;
+        this.tdlylxText = value.dictLabel;
+        this.showLandType = false;
+      },
+      onConfirmLandGradeOptions(value) {
+        this.form.dldj = value.dictValue
+        this.dldjText = value.dictLabel;
+        this.showLandGrade = false;
+      },
+      onConfirmLandPurposeOptions(value){
+        this.form.tdyt = value.dictValue;
+        this.tdytText = value.dictLabel;
+        this.showLandPurpose = false;
+      },
+      generateCode() {
+        generateLandCode({deptId: this.$route.query.deptId}).then(response => {
+          this.$set(this.form, 'dkbm', response.data);
+        });
+      },
+      closePopup() {
+        // 移除矢量图层
+        if (this.vectorLayer) {
+          this.map.removeLayer(this.vectorLayer);
+          this.vectorLayer = "";
+        }
+        this.open = false;
+        this.reset();
+      },
+      reset() {
+        this.form = {
+          deptId: null,
+          dkbm: null,
+          dkmc: null,
+          syqxz: '30',
+          dklb: '99',
+          tdlylx: '01',
+          dldj: '01',
+          tdyt: '1',
+          sfjbnt: '1',
+          scmjm: null,
+          zjrxm: null,
+          dkdz: null,
+          dkxz: null,
+          dknz: null,
+          dkbz: null,
+          dkbzxx: null,
+          theGeom: null
+        };
+        this.syqxzText = '集体土地所有权';
+        this.dklbText = '其他集体土地';
+        this.tdlylxText = '【1】耕地';
+        this.dldjText = '一等地';
+        this.tdytText = '种植业';
+      },
+      openLandCategoryPopup() {
+        // 修改时 && 地块类别为承包地块  不允许打开地块类别弹出层
+        if (this.form.id && this.form.dklb === '10') {
+          this.$toast({
+            icon: 'fail',
+            message: '当前地块为承包地块，不能更改地块类别',
+            duration: '2000'
+          })
+          return ;
+        }
+        this.showLandCategory = true;
       }
     },
   };
 </script>
-
 <style scoped lang="scss">
-  p{margin: 0;}
-  .home_wrapper{
-    width: 100vw;
-    min-height: 100vh;
-    background: #F6F9FB;
-  }
-  .van-nav-bar{
+  ::v-deep .van-nav-bar{
     background: linear-gradient( 173deg, #91E2D3 0%, #CDFCF0 100%);
     ::v-deep.van-icon{
       color: #000000;
     }
   }
-  .list_main{
-    padding:0 3vw;
-    .item{
-      border-radius: 10px;
-      background: #fff;
-      box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1);
-      margin-bottom: 20px;
-      .item_box{
-        padding:15px;
-      }
-      .head_block{
+  .van-popup{
+    background: linear-gradient( 180deg, #E5FFF4 0%, #ffffff 100%);
+    .landPopup{
+      width: 94%;
+      margin: 0 auto;
+      .landPopup_title{
+        color: #29D2AF;
+        font-size: 20px;
         display: flex;
         align-items: center;
-        width: 100%;
-        .title{
-          flex:1;
-          font-size: 16px;
-          color: #252525;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-          padding-right: 20px;
+        justify-content: space-between;
+      }
+    }
+  }
+  .app-container{
+    /*background: #fff url("../../../../../static/images/contracted/contracted_index_bg.png") no-repeat center;*/
+    background-size: 100% 100%;
+    height: 100vh;
+    padding: 0;
+    overflow: hidden;
+  }
+
+  ::v-deep .van-hairline--bottom::after{
+    border: none;
+  }
+
+  ::v-deep .van-field--disabled .van-field__label {
+    color: #646566;
+  }
+
+  ::v-deep .landPopup .van-dialog {
+    width: 90%;
+    height: 85%;
+    overflow-y: auto;
+  }
+
+  ::v-deep .landPopup .van-field__label {
+    width: 7em;
+  }
+
+  .head{
+    padding: 0 4vw;
+  }
+
+  .tap_block{
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    background: #ebfaf2;
+    padding: 2PX 4PX;
+    border-radius: 10PX;
+    margin-top: 1vh;
+    .active{
+      background-image: linear-gradient(to right,#c6fe8b,#48e5a2);
+      box-shadow: 0 0 10PX #cccccc;
+      color: #333333;
+    }
+    p{
+      width: 25%;
+      text-align: center;
+      padding: 5PX 0;
+      border-radius: 10PX;
+      color: #666666;
+    }
+  }
+
+  .legend_main{
+    position: absolute;
+    top: 2vh;
+    right: 2vw;
+  }
+
+  .openLegend{
+    position: absolute;
+    top: 2vh;
+    right: 0vw;
+    background-color: rgba(255,255,255,.5);
+    width: 20PX;
+    height: 70PX;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-top-left-radius: 10PX;
+    border-bottom-left-radius: 10PX;
+    .sanjiao-left {
+      display: inline-block;
+      border-right: 8PX solid #999999;
+      border-right-color: initial;
+      border-top: 5PX solid transparent;
+      border-bottom: 5PX solid transparent;
+    }
+  }
+
+  .legend_second{
+    background: rgba(255,255,255,.5);
+    padding: 2vh;
+    border-radius: 10PX;
+    margin-top: 2vh;
+  }
+
+  .legend_tt{
+    font-size: 16PX;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    img{
+      width: 20PX;
+    }
+  }
+
+  .legend{
+    background: rgba(255,255,255,.5);
+    padding: 2vh;
+    border-radius: 10PX;
+    .van-checkbox{
+      margin-top: 2vh;
+      &:nth-child(1){
+        ::v-deep .van-checkbox__icon .van-icon{
+          /*border-color: rgba(22,233,15,1);*/
+          border: 4px solid #16E90F;
         }
-        .describe{
-          font-size: 14px;
-          color: #29D2AF;
+      }
+      &:nth-child(2){
+        ::v-deep .van-checkbox__icon .van-icon{
+          /*border-color: rgba(1,198,222,1);*/
+          border: 4px solid #01C6DE;
         }
       }
-      .order_block{
-        display: flex;
-        align-items: center;
-        width: 100%;
-        margin-top: 10px;
-        .order{
-          flex: 1;
-          font-size: 16px;
-          color: #666666;
+      &:nth-child(3){
+        ::v-deep .van-checkbox__icon .van-icon{
+          /*border-color: rgba(238,238,0,1);*/
+          border: 4px solid #EEEE00;
         }
-        .describe{
-          font-size: 22px;
-          color: #29D2AF;
+      }
+      &:nth-child(4){
+        ::v-deep .van-checkbox__icon .van-icon{
+          /*border-color: rgba(238,60,60,1);*/
+          border: 4px solid #EE3C3C;
         }
       }
-      .function_block{
-        height: 46px;
-        display: flex;
-        align-items: center;
-        .time{
-          display: flex;
-          flex: 1;
-          align-items: center;
-          font-size: 24px;
-          color: #858585;
-          .icon{
-            width: 25px;
-            height: 25px;
-            display: block;
-            margin-right: 8px;
-          }
+      &:nth-child(5){
+        ::v-deep .van-checkbox__icon .van-icon{
+          /*border-color: rgba(235,134,0,1);*/
+          border: 4px solid #EB8600;
         }
-        .state{
-          /*flex: 1;*/
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          &.sell{
-            color: #f69600;
-          }
-          &.scrap{
-            color: #858585;
-          }
-          &.normal{
-            color: #68c000;
-          }
+      }
+    }
+    .van-checkbox-group {
+      .van-checkbox__label{
+        i{
+          display: block;
+          width: 15PX;
+          height: 15PX;
+          border: 1px solid;
+          border-radius: 3PX;
+          margin-left: 10PX;
+        }
+        .i1{
+          background: rgba(22,233,15,.7);
+          border-color: rgba(22,233,15,1);
+        }
+        .i2{
+          background: rgba(1,198,222,.7);
+          border-color: rgba(1,198,222,1);
+        }
+        .i3{
+          background: rgba(238,238,0,.7);
+          border-color: rgba(238,238,0,1);
+        }
+        .i4{
+          background: rgba(238,60,60,.7);
+          border-color: rgba(238,60,60,1);
         }
-        .value{
-          flex:1;
+        .i5{
+          background: rgba(235,134,0,.7);
+          border-color: rgba(235,134,0,1);
+        }
+        div{
           display: flex;
           align-items: center;
-          justify-content:flex-end;
-          font-size: 24px;
-          color: #858585;
-          .amount{
-            color: #eb1616;
-          }
         }
       }
-
     }
   }
-  ::v-deep .van-swipe-cell__right{
-    display: flex;
-    align-items: center;
-    width: 200PX;
-    margin-left: 5PX;
-    a,div{
-      margin: 0;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: #ffffff;
-      font-size: 14PX;
-      height: 100%;
-      flex: 1;
-    }
+
+  .mapBox{
+    height: 100vh;
+    width: 100%;
   }
 
+  .footer_main {
+    flex: 0 0 120px;
+    background: #ccc;
+    display: flex;
+    justify-content: center; /* 相对父元素水平居中 */
+    align-items: center; /*  子元素相对父元素垂直居中 */
+  }
   .search_box{
     display: flex;
     align-items: center;
     justify-content: space-between;
     width: 94%;
     margin: 2vh auto;
+    position: absolute;
+    left: 3vw;
+    z-index: 9;
+
     .left{
       display: flex;
       align-items: center;
       flex: 1;
       background-color: #ffffff;
       border-radius: 50vh;
-      padding-left: 6%;
       overflow: hidden;
       margin-right: 3vw;
     }
@@ -217,7 +857,7 @@
       flex-shrink: 0;
       background: linear-gradient( 271deg, #53E4A5 0%, #24DBDB 100%);
       border: none;
+      width: 20vw;
     }
   }
-
 </style>
diff --git a/vue.config.js b/vue.config.js
index 46985a1..0824733 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -9,8 +9,8 @@ const CompressionPlugin = require('compression-webpack-plugin')
 
 const name = process.env.VUE_APP_TITLE
 
-const baseUrl = 'http://localhost:8080' // 后端接口
-//const baseUrl = 'http://192.168.0.108:8080' // 后端接口 zzl
+//const baseUrl = 'http://localhost:8080' // 后端接口
+const baseUrl = 'http://192.168.0.109:8080' // 后端接口 zzl
 
 const port = process.env.port || process.env.npm_config_port || 80 // 端口