新型经营主体移动端切图

src/permission.js

@@ -128,6 +128,15 @@ const whiteList = [
   '/sunVillage_info/list_vote',   //详情页
   '/sunVillage_info/list_vote_detail',   //详情页
   '/sunVillage_info/list_vote_form',   //详情页
+  // 新型经营主体
+  'newBusinessEntity/newsBulletin', //新闻公告
+  '/newBusinessEntity/index',      //首页
+  '/newBusinessEntity/login',      //登录
+  '/newBusinessEntity/register',   //注册
+  '/newBusinessEntity/conter',  //底部组件
+  '/newBusinessEntity/newsDetails',  //新闻详情
+  '/newBusinessEntity/listBody',  //主体名录
+  '/newBusinessEntity/map'      //地图
 
 ]
 

src/router/index.js

@@ -3873,7 +3873,77 @@ export const constantRoutes = [
       hidden: true,
     },
     component: (resolve) => require(['@/views/lawEnforcement/caseAllocation/caseEnforceList'], resolve)
-  }
+  },
+  // 新型经营主体
+  {
+    path: '/newBusinessEntity/index',
+    name: 'newBusinessEntity',
+    meta: {
+      title: '主页'
+    },
+    component: (resolve) => require(['@/views/newBusinessEntity/index'], resolve)
+  },
+
+  {
+    path: '/newBusinessEntity/login',
+    name: 'newBusinessEntity',
+    meta: {
+      title: '登录'
+    },
+    component: (resolve) => require(['@/views/newBusinessEntity/login'], resolve)
+  },
+  {
+    path: '/newBusinessEntity/register',
+    name: 'newBusinessEntity',
+    meta: {
+      title: '注册'
+    },
+    component: (resolve) => require(['@/views/newBusinessEntity/register'], resolve)
+  },
+  {
+    path: '/newBusinessEntity/conter',
+    name: 'newBusinessEntity',
+    meta: {
+      title: '组件'
+    },
+    component: (resolve) => require(['@/views/newBusinessEntity/conter'], resolve)
+  },
+  //新闻公告
+  {
+    path: '/newBusinessEntity/newsBulletin',
+    name: 'newsBulletin',
+    meta: {
+      title: '新闻公告'
+    },
+    component: (resolve) => require(['@/views/newBusinessEntity/newsBulletin'], resolve)
+  },
+  //新闻详情
+  {
+    path: '/newBusinessEntity/newsDetails',
+    name: 'newBusinessEntity',
+    meta: {
+      title: '新闻详情'
+    },
+    component: (resolve) => require(['@/views/newBusinessEntity/newsDetails'], resolve)
+  },
+  //主体名录
+  {
+    path: '/newBusinessEntity/listBody',
+    name: 'newBusinessEntity',
+    meta: {
+      title: '主体名录'
+    },
+    component: (resolve) => require(['@/views/newBusinessEntity/listBody'], resolve)
+  },
+  //地图
+  {
+    path: '/newBusinessEntity/map',
+    name: 'newBusinlistBody',
+    meta: {
+      title: '地图'
+    },
+    component: (resolve) => require(['@/views/newBusinessEntity/map'], resolve)
+  },
 ];
 
 

src/views/newBusinessEntity/conter.vue

@@ -0,0 +1,68 @@
+<template>
+  <div class="fotter">
+    <router-view />
+
+    <van-tabbar route active-color="#33db89" @change="onChange" class="aa">
+      <van-tabbar-item to="/newBusinessEntity/index">
+        <span>全部</span>
+        <template #icon="props">
+          <img src="../../assets/images/Newbusinessentity/001_03.jpg" />
+        </template>
+      </van-tabbar-item>
+      <van-tabbar-item to="/newBusinessEntity/index">
+   
+        <template >
+          <img src="../../assets/images/Newbusinessentity/001_05.jpg" />
+        </template>
+        <p>供求</p>
+      </van-tabbar-item>
+
+
+      <!-- <van-tabbar-item replace to="">
+        供求
+        <template #icon="props">
+          <img :src="props.active ? '../../assets/images/Newbusinessentity/001_05.jpg' : '../../assets/images/Newbusinessentity/001_05.jpg'" />
+        </template>
+      </van-tabbar-item> -->
+      <!-- <van-tabbar-item replace to="/newBusinessEntity/index" icon="home-o">全部</van-tabbar-item> -->
+      <!-- <van-tabbar-item replace to="/search" icon="search">供求</van-tabbar-item> -->
+      <van-tabbar-item replace to="/newBusinessEntity/login" icon="search"
+        >我的</van-tabbar-item
+      >
+    </van-tabbar>
+  </div>
+</template>
+<script>
+
+export default {
+  name: "conter",
+  data() {
+    return {
+      active: 0,
+      icon: {
+        active: "../../assets/images/Newbusinessentity/001_03.jpg",
+        inactive: "https://img01.yzcdn.cn/vant/user-inactive.png",
+      },
+    };
+  },
+  methods: {
+    onChange(index) {
+      this.active = index;
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.fotter {
+  position: relative;
+  height: 0.1rem;
+}
+.aa {
+  position: absolute;
+}
+
+.van-tabbar-item__text{
+  display: flex;
+  flex-direction:column;
+}
+</style>

src/views/newBusinessEntity/index.vue

@@ -0,0 +1,496 @@
+<template>
+  <div class="app-container">
+    <div class="box">
+      <div class="app_top">
+        <div class="topa">
+          <div class="appa-left">
+            <span>></span>
+            <span>张的村</span>
+          </div>
+
+          <div class="appa_middeo">
+            <div>
+              <input type="text" class="serch" />
+              <img
+                src="../../assets/images/Newbusinessentity/0_03.png"
+                alt=""
+                class="serchimgs"
+              />
+            </div>
+          </div>
+          <div class="appa_right">
+            <img src="../../assets/images/Newbusinessentity/0_02.png" alt="" />
+          </div>
+        </div>
+        <div class="topb">
+          <div class="namesa">您好，王海明</div>
+          <div class="Serviceeva">经营主体掌上服务平台</div>
+        </div>
+        <div class="topc">
+          <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
+            <van-swipe-item>1</van-swipe-item>
+            <van-swipe-item>2</van-swipe-item>
+            <van-swipe-item>3</van-swipe-item>
+            <van-swipe-item>4</van-swipe-item>
+          </van-swipe>
+        </div>
+      </div>
+      <div class="middle">
+        <ul class="local-nav">
+          <li
+            @click="
+              $router.push(
+                {
+                  name: 'newsBulletin',
+                },
+                () => {},
+                () => {}
+              )
+            "
+          >
+            <!-- <a href="#"> -->
+              <span class="local-nav-icon1 local-nav-icon">
+                <img src="../../assets/images/Newbusinessentity/2.jpg" alt="" />
+              </span>
+              <span class="news">新闻公告</span>
+            <!-- </a> -->
+          </li>
+          <li>
+            <a href="#">
+              <span class="local-nav-icon2 local-nav-icon">
+                <img src="../../assets/images/Newbusinessentity/7.png" alt="" />
+              </span>
+              <span class="news">项目指南</span>
+            </a>
+          </li>
+          <li>
+            <a href="#">
+              <span class="local-nav-icon3 local-nav-icon">
+                <img
+                  src="../../assets/images/Newbusinessentity/book_icon_214994.png"
+                  alt=""
+                />
+              </span>
+              <span class="news">政策法规</span>
+            </a>
+          </li>
+          <li
+            @click="
+              $router.push(
+                {
+                  name: 'newBusinlistBody',
+                },
+                () => {},
+                () => {}
+              )
+            "
+          >
+            <!-- <a href="#"> -->
+            <span class="local-nav-icon4 local-nav-icon">
+              <img
+                src="../../assets/images/Newbusinessentity/box_icon_214997.png"
+                alt=""
+              />
+            </span>
+            <span class="news">主体名录</span>
+            <!-- </a> -->
+          </li>
+          <li>
+            <a href="#">
+              <span class="local-nav-icon5 local-nav-icon">
+                <img
+                  src="../../assets/images/Newbusinessentity/card_credit_icon_214769.png"
+                  alt=""
+                />
+              </span>
+              <span class="news">金融服务</span>
+            </a>
+          </li>
+          <li>
+            <a href="#">
+              <span class="local-nav-icon6 local-nav-icon">
+                <img
+                  src="../../assets/images/Newbusinessentity/dashboard_icon_2148461.png"
+                  alt=""
+                />
+              </span>
+              <span class="news">农技服务</span>
+            </a>
+          </li>
+          <li>
+            <a href="#">
+              <span class="local-nav-icon7 local-nav-icon">
+                <img
+                  src="../../assets/images/Newbusinessentity/66_03.jpg"
+                  alt=""
+                />
+              </span>
+              <span class="news">价格看板</span>
+            </a>
+          </li>
+          <li>
+            <a href="#">
+              <span class="local-nav-icon8 local-nav-icon">
+                <img
+                  src="../../assets/images/Newbusinessentity/cube_icon_2150142.png"
+                  alt=""
+                />
+              </span>
+              <span class="news">培训活动</span>
+            </a>
+          </li>
+        </ul>
+      </div>
+      <div class="bottom">
+        <div class="bttoma">
+          <div class="latestnews">最新资讯</div>
+          <div class="more">更多</div>
+        </div>
+        <div class="bottomb">
+          <ul class="content">
+            <li>
+              <a href="#">
+                <span class="content-icon"></span>
+                <span class="Agricultural">农业服务App上线通知！</span>
+                <span class="Comprehensive"
+                  >新型经营主体综合服务APP今日上线</span
+                >
+              </a>
+            </li>
+            <li>
+              <a href="#">
+                <span class="content-icon"></span>
+                <span class="Agricultural">农业服务App上线通知！</span>
+                <span class="Comprehensive"
+                  >新型经营主体综合服务APP今日上线</span
+                >
+              </a>
+            </li>
+            <li>
+              <a href="#">
+                <span class="content-icon"></span>
+                <span class="Agricultural">农业服务App上线通知！</span>
+                <span class="Comprehensive"
+                  >新型经营主体综合服务APP今日上线</span
+                >
+              </a>
+            </li>
+            <li>
+              <a href="#">
+                <span class="content-icon"></span>
+                <span class="Agricultural">农业服务App上线通知！</span>
+                <span class="Comprehensive"
+                  >新型经营主体综合服务APP今日上线</span
+                >
+              </a>
+            </li>
+          </ul>
+        </div>
+      </div>
+      <!-- <div class="fotter">
+        <van-tabbar v-model="active" class="aa">
+          <van-tabbar-item name="home" icon="home-o">全部</van-tabbar-item>
+          <van-tabbar-item name="search" icon="search">供求</van-tabbar-item>
+          <van-tabbar-item name="friends" icon="friends-o">我的</van-tabbar-item>
+        </van-tabbar>
+      </div> -->
+      <tabbar></tabbar>
+    </div>
+  </div>
+</template>
+<script>
+import tabbar from "./conter.vue";
+export default {
+  components: {
+    tabbar,
+  },
+  data() {
+    return {
+      active: 0,
+    };
+  },
+  methods: {
+    backHistory() {
+      this.$router.go(-1);
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.box {
+  width: 100%;
+}
+.app_top {
+  position: relative;
+  background: red;
+  width: 100%;
+  height: 6.5rem;
+  overflow: hidden;
+  background: url("../../assets/images/Newbusinessentity/0_01.jpg") no-repeat;
+
+  .topa {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    margin-top: 0.3rem;
+
+    .appa-left {
+      height: 0.8rem;
+      background: 3rem;
+      margin-left: 0.2rem;
+      color: white;
+      line-height: 0.7rem;
+    }
+    .appa_right {
+      margin-top: 0.2rem;
+      margin-right: 0.5rem;
+    }
+  }
+
+  .topb {
+    .namesa {
+      font-size: 0.4rem;
+      margin: 0.4rem 0 0.3rem 0.2rem;
+      font-weight: bold;
+    }
+    .Serviceeva {
+      font-weight: normal;
+      font-size: 0.34rem;
+      margin-left: 0.2rem;
+    }
+  }
+  .topc {
+    width: 8.5rem;
+    height: 3.3rem;
+    position: absolute;
+
+    border-radius: 0.3rem;
+    bottom: 0.2rem;
+    left: 0.8rem;
+    .my-swipe .van-swipe-item[data-v-768abd1c] {
+      margin-top: 0.2rem;
+      line-height: 3rem;
+      border-radius: 0.3rem;
+    }
+  }
+}
+.appa_middeo {
+  position: relative;
+  .serch {
+    background: white;
+    width: 6rem;
+    height: 0.8rem;
+    border-radius: 5rem;
+  }
+  .serchimgs {
+    position: absolute;
+    left: 0.5rem;
+    top: 0.2rem;
+  }
+}
+.my-swipe .van-swipe-item {
+  color: #fff;
+  font-size: 20px;
+  line-height: 150px;
+  text-align: center;
+  background-color: #45d385;
+}
+
+.middle {
+  width: 8.5rem;
+  height: 4rem;
+  // background: red;
+  margin: 0 auto;
+
+  .local-nav {
+    display: flex;
+    flex-wrap: wrap;
+
+    li {
+      text-align: center;
+      margin: 0 auto;
+      flex: 23%;
+      display: block;
+      width: 2rem;
+      height: 2rem;
+      // background: blue;
+      .local-nav-icon {
+        position: relative;
+        display: block;
+        width: 1.3rem;
+        height: 1.3rem;
+        background-size: 1.3rem;
+        margin-left: 0.4rem;
+      }
+      .local-nav-icon1 {
+        // position: relative;
+        // display: block;
+        // width: 1.3rem;
+        // height: 1.3rem;
+        background: url("../../assets/images/Newbusinessentity/1.png") no-repeat;
+        // background-size: 1.3rem;
+        // margin-left: 0.4rem;
+        // img {
+        //   position: absolute;
+        //   top: 0.3rem;
+        //   left: 0.3rem;
+        // }
+        img {
+          position: absolute;
+          top: 0.3rem;
+          left: 0.3rem;
+        }
+      }
+      .local-nav-icon2 {
+        background: url("../../assets/images/Newbusinessentity/1731.png")
+          no-repeat;
+
+        img {
+          position: absolute;
+          top: 0.13rem;
+          right: 0.13rem;
+        }
+      }
+
+      .local-nav-icon3 {
+        background: url("../../assets/images/Newbusinessentity/17312.png")
+          no-repeat;
+
+        img {
+          position: absolute;
+          top: 0.13rem;
+          right: 0.13rem;
+        }
+      }
+      .local-nav-icon4 {
+        background: url("../../assets/images/Newbusinessentity/17313.png")
+          no-repeat;
+
+        img {
+          position: absolute;
+          top: 0.13rem;
+          right: 0.13rem;
+        }
+      }
+      .local-nav-icon5 {
+        background: url("../../assets/images/Newbusinessentity/17314.png")
+          no-repeat;
+
+        img {
+          position: absolute;
+          top: 0.19rem;
+          right: 0.07rem;
+        }
+      }
+
+      .local-nav-icon6 {
+        background: url("../../assets/images/Newbusinessentity/17315.png")
+          no-repeat;
+
+        img {
+          position: absolute;
+          top: 0.13rem;
+          right: 0.13rem;
+        }
+      }
+
+      .local-nav-icon7 {
+        background: url("../../assets/images/Newbusinessentity/17316.png")
+          no-repeat;
+
+        img {
+          position: absolute;
+          top: 0.25rem;
+          right: 0.28rem;
+        }
+      }
+      .local-nav-icon8 {
+        background: url("../../assets/images/Newbusinessentity/17317.png")
+          no-repeat;
+
+        img {
+          position: absolute;
+          top: 0.17rem;
+          right: 0.17rem;
+        }
+      }
+
+      .news {
+        display: inline-block;
+        font-size: 0.35rem;
+        margin-top: 0.1rem;
+        color: black;
+      }
+    }
+  }
+}
+.bottom {
+  width: 100%;
+  height: 9.7rem;
+
+  .bttoma {
+    width: 8.5rem;
+    height: 1.5rem;
+    display: flex;
+    justify-content: space-between;
+    margin: 0 auto;
+
+    .latestnews {
+      font-size: 0.5rem;
+      font-weight: bold;
+      margin-left: 0.23rem;
+    }
+    .more {
+      font-size: 0.32rem;
+      color: #adadad;
+      margin-top: 0.1rem;
+      margin-right: 0.23rem;
+    }
+  }
+}
+.bottomb {
+  width: 8.5rem;
+  margin: 0 auto;
+
+  .content {
+    display: block;
+    width: 8.5rem;
+    display: flex;
+    flex-wrap: wrap;
+
+    li {
+      width: 4rem;
+      flex: 1;
+    }
+    .Agricultural {
+      display: block;
+      color: #000000;
+      width: 4rem;
+      font-size: 0.34rem;
+      font-weight: normal;
+    }
+    .Comprehensive {
+      display: block;
+      width: 4rem;
+      color: #7c7c7c;
+    }
+    .content-icon {
+      display: block;
+      width: 4.4rem;
+      height: 2.3rem;
+      background: url("../../assets/images/Newbusinessentity/3_03.jpg")
+        no-repeat;
+      background-size: 4rem;
+    }
+  }
+}
+.fotter {
+  margin-top: 1rem;
+}
+// .aa{
+
+//   position: absolute;
+//     bottom: -0.8rem;
+// }
+</style>

src/views/newBusinessEntity/listBody.vue

@@ -0,0 +1,309 @@
+<template>
+  <div>
+    <div class="box">
+      <div class="top">
+        <div class="topone">
+          <van-icon name="arrow-left" class="leftarrow" @click="backHistory" />
+          <span class="newsbull"> 主体名录 </span>
+          <span
+            class="icons"
+            @click="
+              $router.push(
+                {
+                  name: 'newBusinessbody',
+                },
+                () => {},
+                () => {}
+              )
+            "
+          ></span>
+        </div>
+      </div>
+      <div class="content">
+        <div class="contentone">
+          <div class="comname">
+            <div>
+              <img
+                src="../../assets/images/Newbusinessentity/07104301.png"
+                alt=""
+              />
+            </div>
+            <!-- 内容 -->
+            <div class="comnameright">
+              <span class="corporation">唐山市五四刘四有限公司</span>
+              <div class="delname">
+                <span class="Peopleicon"></span><span>刘永昌</span>
+                <span class="delicon"></span><span>17762000000</span>
+              </div>
+              <div class="mainbusiness">
+                主营业务：蔬菜种植、生猪肉、蔬菜供 应、禽畜蛋类...
+              </div>
+              <div class="establishedtime">成立时间：2022-3-3</div>
+              <img
+                src="../../assets/images/Newbusinessentity/133_03.jpg"
+                alt=""
+                class="sprita"
+              />
+            </div>
+          </div>
+
+          <div class="comname">
+            <div>
+              <img
+                src="../../assets/images/Newbusinessentity/07104301.png"
+                alt=""
+              />
+            </div>
+            <!-- 内容 -->
+            <div class="comnameright">
+              <span class="corporation">唐山市五四刘四有限公司</span>
+              <div class="delname">
+                <span class="Peopleicon"></span><span>刘永昌</span>
+                <span class="delicon"></span><span>17762000000</span>
+              </div>
+              <div class="mainbusiness">
+                主营业务：蔬菜种植、生猪肉、蔬菜供 应、禽畜蛋类...
+              </div>
+              <div class="establishedtime">成立时间：2022-3-3</div>
+              <img
+                src="../../assets/images/Newbusinessentity/133_03.jpg"
+                alt=""
+                class="sprita"
+              />
+            </div>
+          </div>
+
+          <div class="comname">
+            <div>
+              <img
+                src="../../assets/images/Newbusinessentity/07104301.png"
+                alt=""
+              />
+            </div>
+            <!-- 内容 -->
+            <div class="comnameright">
+              <span class="corporation">唐山市五四刘四有限公司</span>
+              <div class="delname">
+                <span class="Peopleicon"></span><span>刘永昌</span>
+                <span class="delicon"></span><span>17762000000</span>
+              </div>
+              <div class="mainbusiness">
+                主营业务：蔬菜种植、生猪肉、蔬菜供 应、禽畜蛋类...
+              </div>
+              <div class="establishedtime">成立时间：2022-3-3</div>
+              <img
+                src="../../assets/images/Newbusinessentity/133_03.jpg"
+                alt=""
+                class="sprita"
+              />
+            </div>
+          </div>
+
+          <div class="comname">
+            <div>
+              <img
+                src="../../assets/images/Newbusinessentity/07104301.png"
+                alt=""
+              />
+            </div>
+            <!-- 内容 -->
+            <div class="comnameright">
+              <span class="corporation">唐山市五四刘四有限公司</span>
+              <div class="delname">
+                <span class="Peopleicon"></span><span>刘永昌</span>
+                <span class="delicon"></span><span>17762000000</span>
+              </div>
+              <div class="mainbusiness">
+                主营业务：蔬菜种植、生猪肉、蔬菜供 应、禽畜蛋类...
+              </div>
+              <div class="establishedtime">成立时间：2022-3-3</div>
+              <img
+                src="../../assets/images/Newbusinessentity/133_03.jpg"
+                alt=""
+                class="sprita"
+              />
+            </div>
+          </div>
+
+          <div class="comname">
+            <div>
+              <img
+                src="../../assets/images/Newbusinessentity/07104301.png"
+                alt=""
+              />
+            </div>
+            <!-- 内容 -->
+            <div class="comnameright">
+              <span class="corporation">唐山市五四刘四有限公司</span>
+              <div class="delname">
+                <span class="Peopleicon"></span><span>刘永昌</span>
+                <span class="delicon"></span><span>17762000000</span>
+              </div>
+              <div class="mainbusiness">
+                主营业务：蔬菜种植、生猪肉、蔬菜供 应、禽畜蛋类...
+              </div>
+              <div class="establishedtime">成立时间：2022-3-3</div>
+              <img
+                src="../../assets/images/Newbusinessentity/133_03.jpg"
+                alt=""
+                class="sprita"
+              />
+            </div>
+          </div>
+
+          <div class="comname">
+            <div>
+              <img
+                src="../../assets/images/Newbusinessentity/07104301.png"
+                alt=""
+              />
+            </div>
+            <!-- 内容 -->
+            <div class="comnameright">
+              <span class="corporation">唐山市五四刘四有限公司</span>
+              <div class="delname">
+                <span class="Peopleicon"></span><span>刘永昌</span>
+                <span class="delicon"></span><span>17762000000</span>
+              </div>
+              <div class="mainbusiness">
+                主营业务：蔬菜种植、生猪肉、蔬菜供 应、禽畜蛋类...
+              </div>
+              <div class="establishedtime">成立时间：2022-3-3</div>
+              <img
+                src="../../assets/images/Newbusinessentity/133_03.jpg"
+                alt=""
+                class="sprita"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="fotter">
+        <tabbar></tabbar>
+      </div>
+    </div>
+  </div>
+</template>
+
+
+<script>
+import tabbar from "./conter.vue";
+export default {
+  components: {
+    tabbar,
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    backHistory() {
+      this.$router.go(-1);
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+span,
+ul,
+li {
+  display: block;
+}
+.top {
+  width: 100%;
+  height: 2.33rem;
+  background: url("../../assets/images/Newbusinessentity/1_02_01.jpg") no-repeat;
+  overflow: hidden;
+  .topone {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    margin-top: 0.2rem;
+    .leftarrow {
+      color: #ffffff;
+      font-size: 0.5rem;
+      margin: 0.92rem 0 0rem 0.5rem;
+      width: 0.5rem;
+    }
+    .newsbull {
+      color: #ffffff;
+      font-size: 0.5rem;
+      font-weight: normal;
+      margin: 0.8rem auto 0 3rem;
+    }
+    .icons {
+      width: 0.5rem;
+      height: 0.5rem;
+      background: url("../../assets/images/Newbusinessentity/map_icon_150908.png")
+        no-repeat;
+      margin: 0.85rem 0.5rem 0.2rem 0.2rem;
+    }
+  }
+}
+.content {
+  width: 100%;
+  background: #f0f0f0;
+  height: 18rem;
+  overflow: hidden;
+  .contentone {
+    margin: 0 auto;
+    width: 93%;
+    height: 10rem;
+    .comnameright {
+      margin-left: 0.2rem;
+
+      border-radius: 0.2rem;
+    }
+    .comname {
+      width: 99%;
+      display: flex;
+      border-radius: 0.2rem;
+      height: 3.31rem;
+      background: #ffffff;
+      margin-top: 0.5rem;
+      .delname {
+        display: flex;
+        margin-top: 0.2rem;
+      }
+      .corporation {
+        font-size: 0.4rem;
+        font-weight: bold;
+      }
+      .Peopleicon {
+        margin: 0.1rem 0.2rem 0.2rem 0rem;
+        width: 0.3rem;
+        height: 0.3rem;
+        background: url("../../assets/images/Newbusinessentity/user_icon_2058202.png");
+      }
+
+      .delicon {
+        margin: 0.1rem 0.2rem 0.2rem 0.6rem;
+        width: 0.28rem;
+        height: 0.3rem;
+        background: url("../../assets/images/Newbusinessentity/phone-call-auricular-symbol-in-black_.png");
+      }
+      .mainbusiness {
+        color: #326700;
+        font-size: 0.35rem;
+      }
+      .establishedtime {
+        font-size: 0.2rem;
+        color: #8f8f8f;
+        margin-top: 0.3rem;
+      }
+      .sprit {
+        height: 0.3rem;
+        width: 0.2rem;
+      }
+      .sprita {
+        display: block;
+        width: 0.8rem;
+        height: 0.3rem;
+        margin-left: 5rem;
+      }
+    }
+  }
+}
+.fotter[data-v-40d35e05] {
+  height: 1.2rem;
+}
+</style>

src/views/newBusinessEntity/login.vue

@@ -0,0 +1,206 @@
+<template>
+  <div>
+    <div class="content">
+      <div class="servrept">
+        新型经济主体掌上<br />
+        <span class="serc"> 综合服务平台</span>
+      </div>
+      <div class="contbottom">
+        <div class="toggle">
+          <button class="nolog">农户登录</button>
+          <button class="qylog">企业登录</button>
+        </div>
+        <div class="register">
+          <div class="usern">
+            <span>用户名</span>
+            <input type="text" class="username" placeholder="请输入用户名" />
+          </div>
+          <div class="passw">
+            <span class="passhz">密码</span>
+            <input type="text" class="password" placeholder="请输入密码" />
+            <span class="qhpass">
+              <img
+                src="../../assets/images/Newbusinessentity/2_03.jpg"
+                alt=""
+              />
+            </span>
+          </div>
+          <div class="loggoto">
+            <button class="loggo">登录</button>
+          </div>
+          <div class="jumpreg">没有农户账号？点此 <a href="#"  @click="$router.push('./register')" >注册</a></div>
+        </div>
+    
+      </div>
+    </div>
+    <tabbar class="fotter"></tabbar>
+  </div>
+</template>
+<script>
+import tabbar from "./conter.vue";
+export default {
+  components:{
+      tabbar
+  },
+  data() {
+    return {
+      active: 0,
+    };
+  },
+};
+</script>
+<style scoped lang="scss">
+span,
+li,
+ul {
+  display: block;
+}
+.content {
+  position: relative;
+  height: 21.2rem;
+  width: 100%;
+  background: url("../../assets/images/Newbusinessentity/333_01.jpg") no-repeat;
+  background-size: 10.16rem;
+  .servrept {
+    font-size: 0.8rem;
+    font-weight: bold;
+    position: absolute;
+    top: 1.7rem;
+    left: 1.8rem;
+  }
+  .serc {
+    margin-left: 0.8rem;
+  }
+  .contbottom {
+    position: absolute;
+    width: 8.7rem;
+    height: 8rem;
+    background: white;
+    border-radius: 0.3rem;
+    top: 10.6rem;
+    left: 0.7rem;
+
+    .register {
+      height: 5rem;
+      width: 7rem;
+   
+      position: absolute;
+      top: 2rem;
+      left: 0.9rem;
+      //密码
+
+      .passw {
+        display: flex;
+        position: relative;
+        top: 0.6rem;
+        background: #eeeeee;
+        height: 0.8rem;
+        width: 7rem;
+        border-radius: 1rem;
+
+        .passhz {
+          position: absolute;
+          left: 0.6rem;
+          top: 0.14rem;
+          color: #b0b0b0;
+          font-size: 0.36rem;
+        }
+        .password {
+          background: #eeeeee;
+          position: absolute;
+          left: 2rem;
+          // background: pink;
+          height: 0.8rem;
+          width: 3rem;
+          font-size: 0.36rem;
+          color: #dbdbdb;
+        }
+        .qhpass {
+          width: 0.5rem;
+          height: 0.5rem;
+          position: absolute;
+          right: 0.3rem;
+          top: 0.2rem;
+        }
+      }
+      //用户名
+
+      .usern {
+        display: flex;
+        position: relative;
+        background: #eeeeee;
+        height: 0.8rem;
+        width: 7rem;
+        border-radius: 1rem;
+        span {
+          position: absolute;
+          left: 0.6rem;
+          top: 0.14rem;
+          color: #b0b0b0;
+          font-size: 0.36rem;
+        }
+        .username {
+          background: #eeeeee;
+          position: absolute;
+          left: 2rem;
+          // background: pink;
+          height: 0.8rem;
+          width: 3rem;
+          font-size: 0.36rem;
+          color: #dbdbdb;
+        }
+
+        //密码
+      }
+    }
+    .toggle {
+      position: absolute;
+      top: 0.5rem;
+      left: 0.8rem;
+      width: 7rem;
+      height: 1.2rem;
+
+      display: flex;
+      justify-content: space-between;
+      .nolog,
+      .qylog {
+        font-size: 0.4rem;
+        font-weight: bold;
+        background: #ffffff;
+      }
+    }
+    .loggoto {
+      position: relative;
+      top: 1.4rem;
+      .loggo {
+        width: 5rem;
+        height: 1rem;
+        text-align: center;
+        color: #ffffff;
+        background: #41d25e;
+        font-size: 0.4rem;
+        position: absolute;
+        left: 1rem;
+        border-radius: 0.3rem;
+      }
+    }
+
+
+    //跳转
+    .jumpreg{
+        position: relative;
+        top: 2.8rem;
+        left: 1.7rem;
+        font-weight:normal;
+        font-size: 0.32rem;
+        a{
+            color:#5bcc5b;
+        }
+    }
+  }
+}
+.fotter{
+    position: relative;
+    height: 0.1rem;
+}
+</style>

src/views/newBusinessEntity/map.vue

@@ -0,0 +1,214 @@
+    <template>
+  <div>
+    <div class="box">
+      <div class="top">
+        <div class="topone">
+          <van-icon name="arrow-left" @click="backHistory" class="arrowl" />
+          <div class="weather">
+            <span class="sun"></span>
+            <span class="cleard">晴天</span>
+            <span class="temperature">20～32℃</span>
+          </div>
+          <div class="province">
+            <span>山东省</span>
+            <span>烟台市</span>
+            <span>莱州市</span>
+            <van-icon name="arrow" class="arrowr" />
+          </div>
+        </div>
+        <div class="search">
+          <input type="text" class="serch" />
+          <img
+            src="../../assets/images/Newbusinessentity/0_03.png"
+            alt=""
+            class="serchimgs"
+          />
+        </div>
+      </div>
+      <div class="footer">
+        <van-cell @click="showPopup">
+          <van-tabs v-model="active">
+            <van-tab title="农户"></van-tab>
+            <van-tab title="新型经营主体"></van-tab>
+            <van-tab title="经济人"></van-tab>
+            <van-tab title="采购商"></van-tab>
+          </van-tabs>
+        </van-cell>
+        <!-- //弹窗内容 -->
+        <van-popup
+          v-model="show"
+          round
+          position="bottom"
+          :style="{ height: '80%' }"
+        >
+          <div>
+            <!-- tab -->
+            <van-tabs v-model="active" id="cc">
+              <van-tab title="农户"></van-tab>
+              <van-tab title="新型经营主体"></van-tab>
+              <van-tab title="经济人"></van-tab>
+              <van-tab title="采购商"></van-tab>
+            </van-tabs>
+            <!-- //搜索栏 -->
+            <div class="searchtow">
+              <input type="text" class="serchtow" />
+              <img
+                src="../../assets/images/Newbusinessentity/0_03.png"
+                alt=""
+                class="serchimgstow"
+              />
+            </div>
+          </div>
+          <div class="suoyin">
+            <van-index-bar>
+              <van-index-anchor index="A" />
+              <van-cell title="安心超人有限公司" />
+              <van-cell title="安心超人有限公司" />
+              <van-cell title="安心超人有限公司" />
+
+              <van-index-anchor index="B" />
+              <van-cell title="百度心超人有限公司" />
+              <van-cell title="百度心超人有限公司" />
+              <van-cell title="百度心超人有限公司" />
+
+              ...
+            </van-index-bar>
+          </div>
+        </van-popup>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      active: 2,
+      show: false,
+    };
+  },
+  methods: {
+    showPopup() {
+      this.show = true;
+    },
+    backHistory() {
+      this.$router.go(-1);
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+span {
+  display: block;
+}
+.top {
+  overflow: hidden;
+  width: 100%;
+  height: 19.5rem;
+  background: url("../../assets/images/Newbusinessentity/56_01.jpg");
+  .topone {
+    display: flex;
+    justify-content: space-around;
+    margin-top: 0.2rem;
+    margin-top: 0.9rem;
+    .weather {
+      display: flex;
+    }
+    .sun {
+      color: #696969;
+      width: 0.3rem;
+      height: 0.3rem;
+      background: url("../../assets/images/Newbusinessentity/weather_forecast.png");
+      margin: 0.25rem 0.2rem 0.2rem 0rem;
+    }
+    .temperature {
+      margin: 0.2rem 0.2rem 0.2rem 0rem;
+    }
+    .cleard {
+      margin: 0.2rem 0.2rem 0.2rem 0rem;
+    }
+    .province {
+      display: flex;
+      width: 3.9rem;
+      height: 0.8rem;
+      background: #45c182;
+      color: #ffffff;
+      border-radius: 0.3rem;
+      font-size: 0.34rem;
+      text-align: center;
+      line-height: 0.8rem;
+      .arrowr {
+        font-size: 0.4rem;
+        margin: 0.2rem 0 0 0.1rem;
+      }
+      span {
+        height: 0.3rem;
+        margin-left: 0.1rem;
+      }
+    }
+    .arrowl {
+      font-size: 0.5rem;
+      font-weight: bold;
+    }
+  }
+  .search {
+    position: relative;
+    height: 0.9rem;
+    top: 0.5rem;
+    left: 0.54rem;
+  }
+  .serch {
+    background: white;
+    width: 9rem;
+    height: 0.8rem;
+    border-radius: 5rem;
+    text-indent: 1rem;
+    // margin: 0.5rem 0.2rem 0.2rem 0.5rem;
+  }
+  .serchimgs {
+    position: absolute;
+    left: 0.5rem;
+    top: 0.2rem;
+  }
+}
+.footer {
+  width: 100%;
+  height: 2rem;
+  background: url("../../assets/images/Newbusinessentity/1_02.jpg") no-repeat;
+  overflow: hidden;
+  .searchtow {
+    position: relative;
+    height: 0.9rem;
+    left: 0.54rem;
+    bottom: 1.1rem;
+  }
+  .serchtow {
+    background: white;
+    width: 9rem;
+    height: 0.8rem;
+    border-radius: 5rem;
+    text-indent: 1rem;
+    // margin: 0.5rem 0.2rem 0.2rem 0.5rem;
+  }
+  .serchimgstow {
+    position: absolute;
+    left: 0.5rem;
+    top: 0.2rem;
+    z-index: 20003;
+  }
+}
+/deep/ .van-cell {
+  background-color: rgba(110, 190, 125, 0.1) !important;
+  padding: 0rem 0rem;
+}
+/deep/ .van-tabs__nav {
+  background-color: rgba(110, 190, 125, 0.2) !important;
+  margin-top: 0.3rem;
+}
+
+#cc {
+  background-color: rgba(110, 190, 125, 0.7) !important;
+  background: url("../../assets/images/Newbusinessentity/1_04_02.jpg") no-repeat;
+  height: 2.7rem;
+}
+</style>

src/views/newBusinessEntity/newsBulletin.vue

@@ -0,0 +1,257 @@
+<template>
+  <div>
+    <div class="box">
+      <div class="top">
+        <div class="topone">
+          <van-icon name="arrow-left" class="leftarrow" @click="backHistory" />
+          <span class="newsbull"> 新闻公告 </span>
+        </div>
+        <div class="cut">
+          <button class="notification" @click="notificationa">通知公告</button>
+          <button class="newsdetails" @click="newsdetailsb">新闻详情</button>
+        </div>
+      </div>
+      <div class="content" v-if="show">
+        <div class="contents" @click="$router.push('./newsDetails') ">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+      </div>
+      <div class="content contentb" v-else>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">a新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">a新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">a新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+        <div class="contents">
+          <img
+            src="../../assets/images/Newbusinessentity/P_fw1200.png"
+            alt=""
+          />
+          <div class="profitmniu">新疆：智慧养牛牛牛牛，利润一头抵五头</div>
+          <div class="times">2022-3-3</div>
+        </div>
+      </div>
+      <div class="fotter">
+        <tabbar></tabbar>
+      </div>
+    </div>
+  </div>
+</template>
+   
+<script>
+import tabbar from "./conter.vue";
+export default {
+  components: {
+    tabbar,
+  },
+  data() {
+    return {
+      show: true,
+    };
+  },
+  methods: {
+    //通知公告
+    notificationa() {
+      if (this.show == true) {
+        return this;
+      } else {
+        this.show = !this.show;
+      }
+    },
+    newsdetailsb() {
+      //新闻详情
+      if (this.show == false) {
+        return this;
+      } else {
+        this.show = !this.show;
+      }
+    },
+    backHistory() {
+      this.$router.go(-1);
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+span,
+li,
+ul {
+  display: inline-block;
+}
+.top {
+  width: 100%;
+  height: 3.11rem;
+  background: url("../../assets/images/Newbusinessentity/1_01.jpg") no-repeat;
+  overflow: hidden;
+  .topone {
+    width: 100%;
+    display: flex;
+    margin-top: 0.2rem;
+    .leftarrow {
+      color: #ffffff;
+      font-size: 0.5rem;
+      margin: 0.8rem 0 0rem 0.5rem;
+      width: 0.5rem;
+    }
+    .newsbull {
+      color: #ffffff;
+      font-size: 0.5rem;
+      font-weight: normal;
+      margin: 0.7rem auto 0 3rem;
+    }
+  }
+  .cut {
+    display: flex;
+    justify-content: space-between;
+    .notification,
+    .newsdetails {
+      color: #ffffff;
+      font-size: 0.35rem;
+      background: #c5e5cc;
+      border-radius: 0.3rem;
+      padding: 0.1rem 0.9rem 0.1rem 0.9rem;
+    }
+    .notification {
+      margin: 0.5rem 0 0 0.7rem;
+    }
+    .newsdetails {
+      margin: 0.5rem 0.6rem 0 0.7rem;
+    }
+  }
+}
+.content {
+  width: 95%;
+  height: 17.2rem;
+  margin: 0 auto;
+  overflow: hidden;
+  .contents {
+    display: flex;
+    justify-content: space-around;
+    margin-top: 0.4rem;
+
+    .profitmniu {
+      width: 3.8rem;
+    }
+    .times {
+      height: 0.45rem;
+      margin-top: 1.2rem;
+      color: #8f8f8f;
+    }
+  }
+}
+.fotter[data-v-40d35e05] {
+  height: 1.4rem;
+}
+</style>

src/views/newBusinessEntity/newsDetails.vue

@@ -0,0 +1,159 @@
+<template>
+  <div>
+    <div class="box">
+      <div class="top">
+        <div class="topone">
+          <van-icon name="arrow-left" class="leftarrow" @click="backHistory" />
+          <span class="newsbull" > 新闻详情 </span>
+        </div>
+      </div>
+      <div class="content">
+        <div class="title">浩浩荡荡！新疆700万头牲畜开始春季转场</div>
+        <div class="issuer">
+          发布人: <span class="cctvnet">央视网</span>
+          <span class="times">2022-3-15</span>
+        </div>
+        <div class="picture">
+          <img
+            src="../../assets/images/Newbusinessentity/t0181f315f1a4f87af1.png"
+            alt=""
+          />
+        </div>
+        <div class="particulars">
+          转场，顾名思义就是啊啊牲畜在各个草之间迁徙转区的每户啊啊牧民都有属于自己的草场，根对对对数和不同，小的三亩，大的信
+          转场，顾名思义就是啊啊牲畜在各个草之间迁徙转区的每户啊啊牧民都有属于自己的草场，根对对对数和不同，小的三亩，大的信
+          转场，顾名思义就是啊啊牲畜在各个草之间迁徙转区的每户啊啊牧民都有属于自己的草场，根对对对数和不同，小的三亩，大的信
+          转场，顾名思义就是啊啊牲畜在各个草之间迁徙转区的每户啊啊牧民都有属于自己的草场，根对对对数和不同，小的三亩，大的信
+          转场，顾名思义就是啊啊牲畜在各个草之间迁徙转区的每户啊啊牧民都有属于自己的草场，根对对对数和不同，小的三亩，大的信
+          转场，顾名思义就是啊啊牲畜在各个草之间迁徙转区的每户啊啊牧民都有属于自己的草场，根对对对数和不同，小的三亩，大的信
+        </div>
+      </div>
+      <div class="accessory">
+        <span class="download">附件下载</span>
+        <div class="downloads">
+          <div class="downloaddoc">
+            <img
+              src="../../assets/images/Newbusinessentity/189948.png"
+              alt=""
+            />
+            <span>附件.doc</span>
+          </div>
+          <div class="downloadxls">
+            <img
+              src="../../assets/images/Newbusinessentity/189980.png"
+              alt=""
+            />
+            <span>附件.xls</span>
+          </div>
+        </div>
+      </div>
+      <div class="fotter">
+        <tabbar></tabbar>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import tabbar from "./conter.vue";
+export default {
+  components: {
+    tabbar,
+  },
+  data() {
+      return{
+
+      }
+  },
+  methods:{
+    backHistory(){
+        this.$router.go(-1)
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+span,
+li,
+ul {
+  display: inline-block;
+}
+.top {
+  width: 100%;
+  height: 2.33rem;
+  background: url("../../assets/images/Newbusinessentity/1_02_01.jpg") no-repeat;
+  overflow: hidden;
+  .topone {
+    width: 100%;
+    display: flex;
+    margin-top: 0.2rem;
+    .leftarrow {
+      color: #ffffff;
+      font-size: 0.5rem;
+      margin: 0.92rem 0 0rem 0.5rem;
+      width: 0.5rem;
+    }
+    .newsbull {
+      color: #ffffff;
+      font-size: 0.5rem;
+      font-weight: normal;
+      margin: 0.8rem auto 0 3.2rem;
+    }
+  }
+}
+.content {
+  .title {
+    font-size: 0.45rem;
+    font-weight: bold;
+    margin: 0.2rem 0.2rem 0.2rem 0.4rem;
+  }
+  .issuer {
+    display: flex;
+    margin-left: 0.4rem;
+    color: #a1a1a1;
+  }
+  .cctvnet {
+    margin-left: 0.2rem;
+  }
+  .times {
+    margin-left: 0.6rem;
+  }
+  .picture {
+    margin: 0.4rem 0.2rem 0.2rem 0.4rem;
+  }
+  .particulars {
+    font-size: 0.2rem;
+    height: 9rem;
+    width: 9.1rem;
+    margin: 0 auto;
+    font-size: 0.37rem;
+    text-indent: 0.8rem;
+  }
+}
+.accessory {
+  .download {
+    font-size: 0.4rem;
+    margin-left: 0.5rem;
+  }
+  .downloads {
+    display: flex;
+    margin: 0.6rem 0.2rem 0.2rem 0.6rem;
+    .downloadxls {
+      margin-left: 0.6rem;
+    }
+    .downloaddoc,
+    .downloadxls {
+      display: flex;
+      flex-direction: column;
+
+      img {
+        width: 0.8rem;
+        height: 0.8rem;
+      }
+    }
+  }
+}
+.fotter[data-v-40d35e05] {
+  height: 2.4rem;
+}
+</style>

src/views/newBusinessEntity/register.vue

@@ -0,0 +1,365 @@
+<template>
+  <div>
+    <div class="box">
+      <div class="list">
+        <div class="regsit">
+          <button class="noreg" @click="Agrireg">农户注册</button>
+          <button class="qyreg" @click="busireg">企业注册</button>
+        </div>
+        <!-- 企业注册 -->
+        <div class="show" v-if="show">
+          <div class="frames frame">
+            <i class="icona icona1"></i>
+            <span>主体类别:</span>
+            <input type="text" class="subject" />
+            <i class="arrows"></i>
+          </div>
+          <div class="frames frame">
+            <i class="icona icona2"></i>
+            <span>主体名称:</span>
+            <input type="text" class="subject" />
+            <!-- <i class="arrows"></i> -->
+          </div>
+          <div class="frames frame">
+            <i class="icona icona3"></i>
+            <span>负责人姓名:</span>
+            <input type="text" class="subject subjectname" />
+            <!-- <i class="arrows"></i> -->
+          </div>
+          <div class="frames frame">
+            <i class="icona icona4"></i>
+            <span>手机号码:</span>
+            <input type="text" class="subject" />
+            <!-- <i class="arrows"></i> -->
+          </div>
+          <div class="frames frame">
+            <i class="icona icona5"></i>
+            <span>验证码:</span>
+            <input type="text" class="subject" />
+            <i class="verification">获取验证码</i>
+          </div>
+          <div class="frames frame">
+            <i class="icona icona6"></i>
+            <span>用户名</span>
+            <input type="text" class="subject" />
+            <!-- <i class="arrows"></i> -->
+          </div>
+          <div class="frames frame">
+            <i class="icona icona7"></i>
+            <span>密码</span>
+            <input type="text" class="subject" />
+            <i class="arrows showh1"></i>
+          </div>
+          <div class="frames frame">
+            <i class="icona icona8"></i>
+            <span>确认密码</span>
+            <input type="text" class="subject" />
+            <i class="arrows showh2"></i>
+          </div>
+        </div>
+        <!-- 农业注册 -->
+        <div class="show" v-else>
+          <div class="frames frame">
+            <i class="icona icona3"></i>
+            <span>农户:</span>
+            <input type="text" class="subject" />
+            <i class="arrows"></i>
+          </div>
+          <div class="frames frame">
+            <i class="icona icona9"></i>
+            <span>身份证:</span>
+            <input type="text" class="subject" />
+            <!-- <i class="arrows"></i> -->
+            <div></div>
+          </div>
+
+          <div class="frames frame">
+            <i class="icona icona4"></i>
+            <span>手机号码:</span>
+            <input type="text" class="subject subjectname" />
+            <!-- <i class="arrows"></i> -->
+            <div class="verify">
+              <i class="verimg"></i>
+              <span class="fapeasant">非本地农户</span>
+            </div>
+          </div>
+
+          <div class="frames frame">
+            <i class="icona icona1"></i>
+            <span>验证码:</span>
+            <input type="text" class="subject" />
+            <i class="verification">获取验证码</i>
+          </div>
+          <div class="frames frame">
+            <i class="icona icona1"></i>
+            <span>用户名:</span>
+            <input type="text" class="subject" />
+            <!-- <i class="arrows"></i> -->
+          </div>
+          <div class="frames frame">
+            <i class="icona icona7"></i>
+            <span>密码</span>
+            <input type="text" class="subject" />
+            <i class="arrows showh1"></i>
+          </div>
+          <div class="frames frame">
+            <i class="icona icona8"></i>
+            <span>确认密码</span>
+            <input type="text" class="subject" />
+            <i class="arrows showh2"></i>
+          </div>
+        </div>
+
+        <div class="loggoto">
+          <button class="loggo">登录</button>
+        </div>
+        <div class="jumpreg">
+          <input type="radio" class="dx" />
+          <span>我已阅读并同意</span>
+          <a href="#">《隐私政策》</a>和 <a href="#">《用户协议》</a><br />
+          <span class="texta">*登录后请完善基础信息成为正式用户</span>
+        </div>
+      </div>
+     
+    </div>
+    <tabbar></tabbar>
+  </div>
+</template>
+<script>
+import tabbar from "./conter.vue";
+export default {
+    components:{
+        tabbar
+    },
+  name: "index",
+  data() {
+    return {
+      show: true,
+    };
+  },
+  methods:{
+    //农业注册
+      Agrireg(){
+            if(this.show==true){
+                return this
+            }else{
+                this.show=!this.show
+            }
+      } ,
+      //企业注册
+      busireg(){
+        if(this.show==false){
+                return this
+            }else{
+                this.show=!this.show
+            }
+      }
+  }
+};
+</script>
+<style scoped lang="scss">
+.box {
+  width: 100%;
+  background: url("../../assets/images/Newbusinessentity/bj_01.jpg") no-repeat;
+  height: 21.2rem;
+  overflow: hidden;
+  position: relative;
+  background-size: 10.2rem;
+}
+.list {
+  width: 9rem;
+  height: 18rem;
+  background: #ffffff;
+  border-radius: 1rem;
+  margin: 1rem auto;
+  position: relative;
+  .regsit {
+    position: absolute;
+    top: 0.5rem;
+    left: 0.8rem;
+    width: 7rem;
+    height: 1.2rem;
+
+    display: flex;
+    justify-content: space-between;
+    .noreg,
+    .qyreg {
+      font-size: 0.4rem;
+      font-weight: bold;
+      background: #ffffff;
+    }
+    .noreg {
+      margin-left: 0.7rem;
+    }
+  }
+  .frame {
+    position: relative;
+    background: #eeeeee;
+    border-radius: 1rem;
+    margin-top: 0.5rem;
+  }
+  //校验农户注册
+  .verify {
+    width: 3rem;
+    position: absolute;
+    right: 0.2rem;
+    top: 0.8rem;
+    .verimg {
+    display: block;
+      width: 0.4rem;
+      height: 0.4rem;
+      background: url('../../assets/images/Newbusinessentity/08_03.jpg') no-repeat;
+      margin: 0.24rem 0rem 0rem 0.5rem
+    }
+    .fapeasant{
+        color: red;
+        font-size: 0.2rem;
+    }
+  }
+  .frames {
+    display: flex;
+    top: 2rem;
+    left: 0.6rem;
+    height: 1rem;
+    width: 8rem;
+
+    span {
+      position: absolute;
+      left: 0.9rem;
+      top: 0.22rem;
+      color: #b0b0b0;
+      font-size: 0.36rem;
+    }
+    .subject {
+      background: #eeeeee;
+      position: absolute;
+      left: 2.5rem;
+      top: 0.1rem;
+      // background: pink;
+      height: 0.8rem;
+      width: 3rem;
+      font-size: 0.36rem;
+      color: #dbdbdb;
+    }
+    .subjectname {
+      left: 2.8rem;
+    }
+    .icona {
+      width: 0.5rem;
+      height: 0.5rem;
+
+      position: absolute;
+      top: 0.29rem;
+      left: 0.3rem;
+    }
+    .icona1 {
+      background: url("../../assets/images/Newbusinessentity/layers_icon_125237.png")
+        no-repeat;
+    }
+    .icona2 {
+      background: url("../../assets/images/Newbusinessentity/home_icon_128501.png")
+        no-repeat;
+    }
+    .icona3 {
+      background: url("../../assets/images/Newbusinessentity/user_icon_125113.png")
+        no-repeat;
+    }
+    .icona4 {
+      background: url("../../assets/images/Newbusinessentity/phone_handset_icon_125195.png")
+        no-repeat;
+    }
+    .icona5 {
+      background: url("../../assets/images/Newbusinessentity/shield_icon_125161.png")
+        no-repeat;
+    }
+    .icona6 {
+      background: url("../../assets/images/Newbusinessentity/user_icon_1251132.png")
+        no-repeat;
+    }
+    .icona7 {
+      background: url("../../assets/images/Newbusinessentity/lock_icon_1252253.png")
+        no-repeat;
+    }
+    .icona8 {
+      background: url("../../assets/images/Newbusinessentity/lock_icon_1252253.png")
+        no-repeat;
+    }
+
+    //农业注册
+    .icona9 {
+      background: url("../../assets/images/Newbusinessentity/licencse_icon_125234.png")
+        no-repeat;
+    }
+
+    .arrows {
+      width: 0.5rem;
+      height: 0.5rem;
+      background: url("../../assets/images/Newbusinessentity/21563.png")
+        no-repeat;
+      position: absolute;
+      top: 0.36rem;
+      right: 0.3rem;
+    }
+    .showh1 {
+      background: url("../../assets/images/Newbusinessentity/showh_03.jpg")
+        no-repeat;
+    }
+    .showh2 {
+      background: url("../../assets/images/Newbusinessentity/view_show_icon_1248113.png")
+        no-repeat;
+    }
+    .verification {
+      width: 2.7rem;
+      height: 0.76rem;
+      color: #ffffff;
+      font-size: 0.2rem;
+      background: #75c757;
+      border-radius: 0.3rem;
+      position: absolute;
+      right: 0.2rem;
+      top: 0.1rem;
+      text-align: center;
+      line-height: 0.76rem;
+      font-size: 0.35rem;
+    }
+  }
+  .loggoto {
+    position: relative;
+    top: 1.4rem;
+    .loggo {
+      width: 6rem;
+      height: 1rem;
+      text-align: center;
+      color: #ffffff;
+      background: #41d25e;
+      font-size: 0.4rem;
+      position: absolute;
+      left: 1.7rem;
+      top: 1.6rem;
+      border-radius: 0.4rem;
+    }
+  }
+  .jumpreg {
+    position: relative;
+    top: 4.5rem;
+    left: 1.2rem;
+    font-weight: normal;
+    font-size: 0.32rem;
+    color: #858585;
+
+    overflow: hidden;
+    a {
+      color: #3096ff;
+    }
+    .dx {
+      border: #5bcc5b 0.2rem solid;
+      background: #5bcc5b;
+      color: #5bcc5b;
+    }
+    .texta {
+      display: block;
+      margin: 0.3rem 0 0 0.6rem;
+    }
+  }
+}
+</style>