宅基地前端切图

config/index.js

@@ -13,7 +13,9 @@ module.exports = {
       "/api": {
         // 请求的目标主机
         //target: 'http://116.255.135.38:8081/nsgk_test/',
-        target: 'http://localhost:8080/',
+        //target: 'http://localhost:8080/',
+        //target:'192.168.31.228:8080',
+        //target:'192.168.31.228:8080',
         changeOrigin: true,
         pathRewrite: {
           '^/api': ''
@@ -23,7 +25,7 @@ module.exports = {
 
     // Various Dev Server settings
     host: '0.0.0.0', // can be overwritten by process.env.HOST
-    port: 85, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
+    port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
     autoOpenBrowser: false,
     errorOverlay: true,
     notifyOnErrors: true,

src/permission.js

@@ -30,8 +30,13 @@ const whiteList = [
   '/attestationDetail',
   '/noticeDetail',
   '/homestead/login',
-
-
+  '/applicationForm',
+  '/applicationList',
+  '/certificateList',
+  '/certificateSee',
+  '/informationList',
+  '/circulationList',
+  '/circulationAdd',
 ]
 
 router.beforeEach((to, from, next) => {

src/router/index.js

@@ -381,6 +381,69 @@ export const constantRoutes = [
       hidden: true,
     },
     component: (resolve) => require(['@/views/authenticRight/login'], resolve)
+  },
+  {
+    path: '/applicationForm',
+    name: 'authenticRightLogin',
+    meta: {
+      title: '农村宅基地申请表',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/homeApplication/applicationForm'], resolve)
+  },
+  {
+    path: '/applicationList',
+    name: 'applicationList',
+    meta: {
+      title: '宅基地申请',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/homeApplication/applicationList'], resolve)
+  },
+  {
+    path: '/certificateList',
+    name: 'certificateList',
+    meta: {
+      title: '证书查看',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/certificate/certificateList'], resolve)
+  },
+  {
+    path: '/certificateSee',
+    name: 'certificateSee',
+    meta: {
+      title: '证书查看',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/certificate/certificateSee'], resolve)
+  },
+  {
+    path: '/informationList',
+    name: 'informationList',
+    meta: {
+      title: '公示信息',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/publicityInformation/informationList'], resolve)
+  },
+  {
+    path: '/circulationList',
+    name: 'circulationList',
+    meta: {
+      title: '使用权流转',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/circulation/circulationList'], resolve)
+  },
+  {
+    path: '/circulationAdd',
+    name: 'circulationAdd',
+    meta: {
+      title: '添加宅基地使用流转权',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/circulation/circulationAdd'], resolve)
   }
 
 

src/views/certificate/certificateList.vue

@@ -0,0 +1,75 @@
+<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-swipe-cell v-for="(item,index) in 10">
+        <van-cell title="李凤莲-宅基地申请" value="查看证书" center to="certificateSee">
+          <template #icon>
+            <van-icon name="../../../static/images/icon/icon_zs.png" size="22" color="#7790FE" style="margin-right: 10px;" />
+          </template>
+          <template #label>
+            <p>3710022021000001</p>
+          </template>
+        </van-cell>
+        <template #right>
+          <van-button square text="删除" type="danger" class="delete-button" />
+        </template>
+      </van-swipe-cell>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "applicationList",
+  data() {
+    return {
+
+    };
+  },
+  created() {
+
+  },
+  methods: {
+
+  },
+}
+</script>
+
+<style scoped>
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .delete-button {
+    height: 100%;
+  }
+</style>

src/views/certificate/certificateSee.vue

@@ -0,0 +1,57 @@
+<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-tabs swipeable animated sticky color="#1D6FE9" title-active-color="#1D6FE9"	>
+        <van-tab title="规划许可证">
+          <div class="main-box">
+            <van-image src="../../../static/images/temporary/6.jpg" />
+            <van-image src="../../../static/images/temporary/7.jpg" />
+            <van-image src="../../../static/images/temporary/8.jpg" />
+          </div>
+        </van-tab>
+        <van-tab title="宅基地批准书">
+          <div class="main-box">
+            <van-image src="../../../static/images/temporary/9.jpg" />
+          </div>
+        </van-tab>
+      </van-tabs>
+
+    </div>
+</template>
+
+<script>
+export default {
+    name: "applicationList",
+  data() {
+    return {
+
+    };
+  },
+  created() {
+
+  },
+  methods: {
+
+  },
+}
+</script>
+
+<style scoped>
+  .app-container {
+  }
+  .main-box{
+    padding: 4% 3%;
+    background-color: #FFF;
+    margin-top: 0.3rem;
+  }
+</style>

src/views/circulation/circulationAdd.vue

@@ -0,0 +1,303 @@
+<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>
+
+          <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
+            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-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>
+
+        <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>
+
+          <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
+            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
+            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>
+
+        <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>
+
+          <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>
+
+        <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>
+
+        <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>
+
+      </van-form>
+    </div>
+</template>
+
+<script>
+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() {
+
+  },
+  methods: {
+    onConfirm(value) {
+      this.value = value;
+      this.showPicker = false;
+    },
+  },
+}
+</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/circulation/circulationList.vue

@@ -0,0 +1,91 @@
+<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>
+        <template #right>
+          <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>
+          </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>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "circulationList",
+  data() {
+    return {
+
+    };
+  },
+  created() {
+
+  },
+  methods: {
+
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .delete-button {
+    height: 100%;
+  }
+  .van-row{
+    height: 100%;
+  }
+  .van-col{
+    height: 100%;
+  }
+</style>

src/views/homeApplication/applicationForm.vue

@@ -0,0 +1,360 @@
+<template>
+    <div class="app-container">
+      <van-nav-bar
+        title="农村宅基地申请"
+        left-arrow
+        fixed
+        placeholder
+        @click-left="$router.back(-1)"
+      />
+      <van-steps :active="active" active-color="#38f">
+        <van-step>申请</van-step>
+        <van-step>开工</van-step>
+        <van-step>验收</van-step>
+      </van-steps>
+      <p class="topTit">农村宅基地和建房（规划许可）申请表</p>
+      <div class="main">
+        <van-form @submit="onSubmit">
+          <p class="main_title">申请用户信息</p>
+          <div class="main_box">
+            <van-field label="姓名" placeholder="姓名" input-align="right"/>
+            <van-field label="性别" placeholder="性别" input-align="right"/>
+            <van-field label="年龄" placeholder="年龄" input-align="right"/>
+            <van-field label="联系电话" placeholder="联系电话" input-align="right"/>
+            <van-field label="身份证号" placeholder="身份证号" input-align="right"/>
+            <van-field label="户口所在地" placeholder="户口所在地" input-align="right"/>
+            <van-field label="家庭住址" placeholder="家庭住址" input-align="right"/>
+            <van-field label="家庭人口数" placeholder="家庭人口数" input-align="right"/>
+            <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>
+
+          <p class="main_title">家庭成员信息<van-button icon="plus" size="mini" type="primary" class="addFamily" /></p>
+          <div class="main_box">
+            <van-field label="姓名" placeholder="姓名" input-align="right"/>
+            <van-field label="年龄" placeholder="年龄" input-align="right"/>
+            <van-field label="与户主关系" placeholder="与户主关系" input-align="right"/>
+            <van-field label="身份证号" placeholder="身份证号" input-align="right"/>
+            <van-field label="户口所在地" placeholder="户口所在地" input-align="right"/>
+          </div>
+          <div class=" familyList">
+            <van-button icon="minus" size="mini" type="danger" class="deleteFamily" />
+            <div class="main_box">
+              <van-field label="姓名" placeholder="姓名" input-align="right"/>
+              <van-field label="年龄" placeholder="年龄" input-align="right"/>
+              <van-field label="与户主关系" placeholder="与户主关系" input-align="right"/>
+              <van-field label="身份证号" placeholder="身份证号" input-align="right"/>
+              <van-field label="户口所在地" placeholder="户口所在地" input-align="right"/>
+            </div>
+          </div>
+
+          <p class="main_title">现宅基地及农房状况</p>
+          <div class="main_box">
+            <van-field label="宅基地面积" placeholder="宅基地面积" input-align="right"/>
+            <van-field label="人均宅基地面积" placeholder="人均宅基地面积㎡" input-align="right" label-width="auto"/>
+            <van-field label="不动产单元号" placeholder="不动产单元号" input-align="right"/>
+            <van-field label="建筑面积" placeholder="建筑面积㎡" input-align="right"/>
+            <van-field label="人均建筑面积" placeholder="人均建筑面积㎡" input-align="right"/>
+            <van-field label="农民房屋幢号" placeholder="户口所在地" input-align="right"/>
+            <van-field
+              readonly
+              clickable
+              name="picker"
+              :value="value"
+              label="处置情况"
+              placeholder="选择宅基地处置情况"
+              @click="showPicker = true"
+              input-align="right"
+            />
+            <van-popup v-model="showPicker" position="bottom">
+              <van-picker
+                show-toolbar
+                :columns="columns"
+                @confirm="onConfirm"
+                @cancel="showPicker = false"
+              />
+            </van-popup>
+
+            <van-field
+              readonly
+              clickable
+              name="picker"
+              :value="value"
+              label="建房类型"
+              placeholder="选择建房类型"
+              @click="showPicker = true"
+              input-align="right"
+            />
+            <van-popup v-model="showPicker" position="bottom">
+              <van-picker
+                show-toolbar
+                :columns="columns"
+                @confirm="onConfirm"
+                @cancel="showPicker = false"
+              />
+            </van-popup>
+          </div>
+
+          <p class="main_title">拟申请宅基地及建房情况</p>
+          <div class="main_box">
+            <van-field label="拟建位置" placeholder="拟建位置" input-align="right"/>
+            <van-field label="宅基地面积" placeholder="宅基地面积" input-align="right"/>
+            <van-field label="东至" placeholder="东至" input-align="right"/>
+            <van-field label="西至" placeholder="西至" input-align="right"/>
+            <van-field label="南至" placeholder="南至" input-align="right"/>
+            <van-field label="北至" placeholder="北至" input-align="right"/>
+            <van-field label="建筑面积" placeholder="建筑面积" input-align="right"/>
+            <van-field label="建筑层数" placeholder="建筑层数" input-align="right"/>
+            <van-field label="建筑高度" placeholder="建筑高度" input-align="right"/>
+            <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>
+            <van-field
+              readonly
+              clickable
+              name="picker"
+              :value="value"
+              label="房屋构造"
+              placeholder="选择房屋构造"
+              @click="showPicker = true"
+              input-align="right"
+            />
+            <van-popup v-model="showPicker" position="bottom">
+              <van-picker
+                show-toolbar
+                :columns="columns"
+                @confirm="onConfirm"
+                @cancel="showPicker = 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>
+
+          <p class="main_title">申请理由</p>
+          <div class="main_box">
+            <van-field
+              rows="3"
+              autosize
+              type="textarea"
+              placeholder="申请理由"
+              input-align="left"
+            />
+            <van-row>
+              <van-col span="12"><van-field label="申请人" placeholder="申请人" input-align="left" label-width="auto"/></van-col>
+              <van-col span="12">
+                <van-field v-model="nowTime" label-width="auto">
+                  <template #label>
+                    <van-icon name="notes-o" size="20"/>
+                  </template>
+                </van-field>
+              </van-col>
+            </van-row>
+          </div>
+
+          <p class="main_title">会议纪要</p>
+          <div class="main_box file-box">
+            <van-uploader v-model="fileList" multiple />
+          </div>
+
+          <p class="main_title">宅基地使用承诺书</p>
+          <div class="main_box file-box">
+            <van-uploader v-model="fileList2" multiple class="aaa" />
+          </div>
+
+          <div style="margin: 16px;">
+            <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="topTit">宅基地开工</p>
+          <div class="main_box action-box">
+            <van-cell title="计划开工时间">
+              <template #right-icon>
+                <van-radio-group v-model="radio" direction="horizontal">
+                  <van-field readonly clickable style="padding: 0" v-model="value2" label-width="auto" placeholder="选择日期" @click="showCalendar = true">
+                    <template #label>
+                      <van-icon name="notes-o" size="20"/>
+                    </template>
+                  </van-field>
+                  <van-calendar v-model="showCalendar" @confirm="onConfirm2" />
+                </van-radio-group>
+              </template>
+            </van-cell>
+            <van-cell title="计划竣工时间">
+              <template #right-icon>
+                <van-radio-group v-model="radio" direction="horizontal">
+                  <van-field readonly clickable style="padding: 0" v-model="value2" label-width="auto" placeholder="选择日期" @click="showCalendar = true">
+                    <template #label>
+                      <van-icon name="notes-o" size="20"/>
+                    </template>
+                  </van-field>
+                  <van-calendar v-model="showCalendar" @confirm="onConfirm2" />
+                </van-radio-group>
+              </template>
+            </van-cell>
+          </div>
+
+          <p class="topTit">宅基地验收申请</p>
+          <div class="main_box check-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 label="乡村建设规划许可证号" placeholder="乡村建设规划许可证号" input-align="right" label-width="auto"/>
+            <van-field label="农村宅基地批准书号" placeholder="农村宅基地批准书号" input-align="right" label-width="auto"/>
+            <van-field label="开工日期" readonly clickable v-model="value2" input-align="right" label-width="auto" placeholder="选择开工日期" @click="showCalendar = true"></van-field>
+            <van-calendar v-model="showCalendar" @confirm="onConfirm2" />
+            <van-field label="竣工日期" readonly clickable v-model="value2" input-align="right" label-width="auto" placeholder="选择竣工日期" @click="showCalendar = true"></van-field>
+            <van-calendar v-model="showCalendar" @confirm="onConfirm2" />
+            <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 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 label="建筑面积" placeholder="建筑面积" input-align="right" label-width="auto"/>
+            <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>
+            <van-field label="备注" placeholder="" input-align="right"/>
+          </div>
+        </van-form>
+      </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "applicationForm",
+  data() {
+    return {
+      active: 0,
+      nowTime:'2020-08-06',//当前日期
+      fileList: [],
+      fileList2: [],
+      radio:'1',
+      value: '',
+      columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
+      showPicker: false,
+      value2: '',
+      showCalendar: false,
+    };
+  },
+  created() {
+
+  },
+  methods: {
+    onConfirm(value) {
+      this.value = value;
+      this.showPicker = false;
+    },
+    onConfirm2(date) {
+      this.value2 = `${date.getMonth() + 1}/${date.getDate()}`;
+      this.showCalendar = false;
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+  }
+  .van-steps{
+    padding: 2% 6% 0;
+  }
+  .topTit{
+    margin-top: 0.4rem;
+    font-size: 0.45rem;
+    background-color: #1D6FE9;
+    color: #FFFFFF;
+    line-height: 58px;
+    text-align: center;
+    box-shadow: 0px 3px 6px 0px rgba(15,67,145,0.40);
+  }
+  .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;
+  }
+  /deep/.van-radio--horizontal{
+    margin-left: 20px;
+    margin-right: 0;
+  }
+  .file-box{
+    padding: 2% 5% 0;
+  }
+  .submitButton{
+    width: 80%;
+    margin: 0 auto;
+    background-color: #1D6FE9;
+    border-radius: 14px;
+  }
+  .timeTit{
+    text-align: center;
+    font-size: 16px;
+    line-height: 27px;
+  }
+  .action-box{
+    padding: 15px 0!important;
+    margin-top: 0.4rem;
+  }
+  .check-box{
+    margin-top: 0.4rem;
+  }
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+  .deleteFamily{
+    position: absolute;
+    top: -0.3rem;
+    right: 6%;
+    z-index: 9;
+    border-radius: 50%;
+  }
+  .familyList{
+    margin-top: 0.4rem;
+    position: relative;
+  }
+</style>

src/views/homeApplication/applicationList.vue

@@ -0,0 +1,78 @@
+<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>
+        <template #right>
+          <van-icon name="add" size="18" />
+        </template>
+      </van-nav-bar>
+      <van-swipe-cell v-for="(item,index) in 10">
+        <van-cell title="3710022021000001" value="申请草稿" center >
+          <template #icon>
+            <van-icon name="../../../static/images/icon/icon_fz.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+          </template>
+          <template #label>
+            <p>李粉连<i style="margin-right: 0.5rem;"></i>原址翻建申请</p>
+          </template>
+        </van-cell>
+        <template #right>
+          <van-button square text="删除" type="danger" class="delete-button" />
+        </template>
+      </van-swipe-cell>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "applicationList",
+  data() {
+    return {
+
+    };
+  },
+  created() {
+
+  },
+  methods: {
+
+  },
+}
+</script>
+
+<style scoped>
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .delete-button {
+    height: 100%;
+  }
+</style>

src/views/publicityInformation/informationList.vue

@@ -0,0 +1,99 @@
+<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-search v-model="value" placeholder="请输入姓名" class="searchInput" @search="onSearch" show-action>
+        <template #action>
+          <div @click="onSearch" style="color:#B4B0B0 ">搜索</div>
+        </template>
+      </van-search>
+      <van-swipe-cell v-for="(item,index) in 10">
+        <van-cell title="张婷婷-异地新建申请" value="公示中" center >
+          <template #icon>
+            <van-icon name="../../../static/images/icon/icon_gs.png" size="22" color="#539FFD" style="margin-right: 10px;" />
+          </template>
+          <template #label>
+            <p>镇级公示<i style="margin-right: 0.5rem;"></i>2021.01.02-2021.01.07</p>
+          </template>
+        </van-cell>
+      </van-swipe-cell>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "applicationList",
+  data() {
+    return {
+      value:'',
+      value2:'',
+      showPicker: false,
+      columns: ['杭州', '宁波', '温州', '绍兴', '湖州', '嘉兴', '金华', '衢州'],
+    };
+  },
+  created() {
+
+  },
+  methods: {
+    onConfirm(value) {
+      this.value2 = value;
+      this.showPicker = false;
+    },
+    onSearch(){
+
+    }
+  },
+}
+</script>
+
+<style scoped>
+  .app-container {
+    padding: 0.2rem 3%;
+  }
+  /deep/.van-cell__title{
+    flex: 0.7;
+  }
+  /deep/.van-cell__title span{
+    font-family: Arial;
+    font-size: 0.4rem;
+    font-weight: normal;
+  }
+  /deep/.van-cell__value{
+    flex: 0.3;
+    color: #1D6FE9;
+    font-weight: bold;
+  }
+  /deep/.van-swipe-cell{
+    margin-bottom: 0.2rem;
+    border-radius: 0.2rem;
+    overflow: hidden;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+  }
+  /deep/van-ellipsis{
+    font-weight: bold;
+  }
+  .delete-button {
+    height: 100%;
+  }
+  /deep/.van-search__content{
+    background-color: transparent;
+  }
+  /deep/.van-search__action{
+    padding-right: 0.5rem;
+  }
+  .searchInput{
+    background: #ffffff;
+    border: 1px solid #c9c9c9;
+    border-radius: 50px;
+    padding:0 ;
+    margin-bottom: 0.2rem;
+  }
+</style>