diff --git a/jero-web/src/views/phoneView/home.vue b/jero-web/src/views/phoneView/home.vue
index 53dc7330f..1f260c78a 100644
--- a/jero-web/src/views/phoneView/home.vue
+++ b/jero-web/src/views/phoneView/home.vue
@@ -1,13 +1,47 @@
 <template>
-
+  <div class="box">
+    <van-tabbar v-model="active" @change="onChange">
+      <van-tabbar-item name="search" icon="search">搜索</van-tabbar-item>
+      <van-tabbar-item name="toDoCenter" icon="bell">待办中心</van-tabbar-item>
+      <van-tabbar-item name="taskData" icon="underway">任务统计</van-tabbar-item>
+      <van-tabbar-item name="home" icon="manager">我的</van-tabbar-item>
+    </van-tabbar>
+  </div>
 </template>
 
 <script>
   export default {
-    name: 'phoneHome'
+    name: 'phoneHome',
+    data() {
+      return {
+        active: 'home'
+      }
+    },
+    methods: {
+      onChange(value) {
+        if (value == 'toDoCenter') {
+          this.$router.push({
+            path: '/phoneToDoCenter'
+          })
+        } else if (value == 'taskData') {
+          this.$router.push({
+            path: '/phoneTaskData'
+          })
+        } else if (value == 'search') {
+          this.$router.push({
+            path: '/phoneSearch'
+          })
+        }
+      }
+    }
   }
 </script>
 
 <style scoped>
-
+  ::v-deep .van-tabbar-item--active {
+    color: #00B3BE;
+  }
+  .box {
+    padding: 0.4rem;
+  }
 </style>
\ No newline at end of file
diff --git a/jero-web/src/views/phoneView/search.vue b/jero-web/src/views/phoneView/search.vue
index a452cf96e..1d761c423 100644
--- a/jero-web/src/views/phoneView/search.vue
+++ b/jero-web/src/views/phoneView/search.vue
@@ -63,7 +63,19 @@
     },
     methods: {
       onChange(value) {
-        console.log(value)
+        if (value == 'toDoCenter') {
+          this.$router.push({
+            path: '/phoneToDoCenter'
+          })
+        } else if (value == 'taskData') {
+          this.$router.push({
+            path: '/phoneTaskData'
+          })
+        } else if (value == 'home') {
+          this.$router.push({
+            path: '/phoneHome'
+          })
+        }
       }
     }
   }
@@ -81,7 +93,7 @@
   .header-box {
     width: 100%;
     text-align: center;
-    padding-top: 2.5rem;
+    padding-top: 2.2rem;
     display: flex;
     align-items: center;
     justify-content: center;
diff --git a/jero-web/src/views/phoneView/taskData.vue b/jero-web/src/views/phoneView/taskData.vue
index a76af35ee..acac3b1f7 100644
--- a/jero-web/src/views/phoneView/taskData.vue
+++ b/jero-web/src/views/phoneView/taskData.vue
@@ -1,13 +1,188 @@
 <template>
+  <div class="box">
+    <div class="content">
+      <van-tabs v-model="activeTab">
+        <van-tab name="regulatoryCertification" title="法规认证流程"></van-tab>
+        <van-tab name="parametercollection" title="认证参数收集"></van-tab>
+      </van-tabs>
+    </div>
+    <div class="content-box">
+      <div class="regulatory" v-if="activeTab == 'regulatoryCertification'">
+        <div class="content-box-text">
+          法规认证流程数据
+        </div>
+        <div class="content-box-data">
+          <div class="content-box-data-text">
+            法规清单发布
+          </div>
+          <div class="content-box-data-num">
+            24
+          </div>
+        </div>
+        <div class="content-box-data">
+          <div class="content-box-data-text">
+            法规清单发布
+          </div>
+          <div class="content-box-data-num">
+            24
+          </div>
+        </div>
+        <div class="content-box-data">
+          <div class="content-box-data-text">
+            法规清单发布
+          </div>
+          <div class="content-box-data-num">
+            24
+          </div>
+        </div>
+        <div class="content-box-data">
+          <div class="content-box-data-text">
+            法规清单发布
+          </div>
+          <div class="content-box-data-num">
+            24
+          </div>
+        </div>
+        <div class="content-box-data">
+          <div class="content-box-data-text">
+            法规清单发布
+          </div>
+          <div class="content-box-data-num">
+            24
+          </div>
+        </div>
+        <div class="content-box-data">
+          <div class="content-box-data-text">
+            法规清单发布
+          </div>
+          <div class="content-box-data-num">
+            24
+          </div>
+        </div>
+      </div>
+    </div>
 
+    <van-tabbar v-model="active" @change="onChange">
+      <van-tabbar-item name="search" icon="search">搜索</van-tabbar-item>
+      <van-tabbar-item name="toDoCenter" icon="bell">待办中心</van-tabbar-item>
+      <van-tabbar-item name="taskData" icon="underway">任务统计</van-tabbar-item>
+      <van-tabbar-item name="home" icon="manager">我的</van-tabbar-item>
+    </van-tabbar>
+  </div>
 </template>
 
 <script>
   export default {
-    name: 'phoneTaskData'
+    name: 'phoneTaskData',
+    data() {
+      return {
+        active: 'taskData',
+        activeTab: 'regulatoryCertification'
+      }
+    },
+    methods: {
+      onChange(value) {
+        if (value == 'toDoCenter') {
+          this.$router.push({
+            path: '/phoneToDoCenter'
+          })
+        } else if (value == 'search') {
+          this.$router.push({
+            path: '/phoneSearch'
+          })
+        } else if (value == 'home') {
+          this.$router.push({
+            path: '/phoneHome'
+          })
+        }
+      }
+    }
   }
 </script>
 
 <style scoped>
+  ::v-deep .van-tabbar-item--active {
+    color: #00B3BE;
+  }
 
+  .content {
+    margin-top: 0.18rem;
+    position: relative;
+  }
+
+  ::v-deep .van-tabs__line {
+    background-color: #00B3BE;
+  }
+
+  ::v-deep .van-tab {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #868A9A;
+    flex: none;
+    margin-right: 0.2rem;
+  }
+
+  ::v-deep .van-tab--active {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Medium, PingFang SC;
+    font-weight: 600;
+    color: #040B29;
+  }
+
+  .regulatory {
+    padding: 0.36rem 0.36rem 0 0.36rem;
+    background: #fff;
+    box-shadow: 0.1rem 0.1rem 0.16rem 0 rgba(54, 61, 84, 0.05);
+    border-radius: 0.2rem;
+    overflow: hidden;
+  }
+
+  ::v-deep .van-tabs {
+    padding: 0 0.4rem;
+  }
+
+  .content-box {
+    width: 100%;
+    padding: 0.4rem;
+    background: #F7F7F8;
+  }
+
+  .content-box-text {
+    font-size: 0.4rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #040B29;
+    margin-bottom: 0.4rem;
+    margin-top: 0.2rem;
+  }
+
+  .content-box-data {
+    background: #F7F8FA;
+    border-radius: 0.2rem;
+    padding: 0.42rem;
+    box-sizing: border-box;
+    width: calc(50% - 0.2rem);
+    display: inline-block;
+    margin-right: 0.4rem;
+    margin-bottom: 0.4rem;
+  }
+
+  .content-box-data:nth-child(odd) {
+    margin-right: 0;
+  }
+
+  .content-box-data-text {
+    font-size: 0.36rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #41475E;
+  }
+
+  .content-box-data-num {
+    font-size: 0.42rem;
+    font-family: PingFang SC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #01A0AC;
+  }
 </style>
\ No newline at end of file
diff --git a/jero-web/src/views/phoneView/toDoCenter.vue b/jero-web/src/views/phoneView/toDoCenter.vue
index 0429dd858..986b26fcf 100644
--- a/jero-web/src/views/phoneView/toDoCenter.vue
+++ b/jero-web/src/views/phoneView/toDoCenter.vue
@@ -1,13 +1,257 @@
 <template>
-
+  <div class="box">
+    <div class="header-search">
+      <van-icon class="icon" name="arrow-left"/>
+      <van-search v-model="value"
+                  show-action
+                  action-text="清空"
+                  placeholder="搜索"/>
+    </div>
+    <div class="content">
+      <van-tabs v-model="activeTab">
+        <van-tab name="whole" title="待办流程"></van-tab>
+        <van-tab title="已办流程"></van-tab>
+        <van-tab title="已发流程"></van-tab>
+      </van-tabs>
+      <div class="search-right">
+        <van-icon class="search-right-icon" name="filter-o"/>
+      </div>
+    </div>
+    <div class="content-box">
+      <div class="content-box-content">
+        <div class="content-box-title">
+          ISO 16750-4-2003
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">类别</span>
+          <span class="content-box-text">设计符合性流程</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">项目</span>
+          <span class="content-box-text">Aries-G1.1-中国台湾-00</span>
+        </div>
+        <div class="content-box-right">
+          符合性审查
+        </div>
+      </div>
+      <div class="content-box-content">
+        <div class="content-box-title">
+          ISO 16750-4-2003
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">类别</span>
+          <span class="content-box-text">设计符合性流程</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">项目</span>
+          <span class="content-box-text">Aries-G1.1-中国台湾-00</span>
+        </div>
+        <div class="content-box-right">
+          符合性审查
+        </div>
+      </div>
+      <div class="content-box-content">
+        <div class="content-box-title">
+          ISO 16750-4-2003
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">类别</span>
+          <span class="content-box-text">设计符合性流程</span>
+        </div>
+        <div class="content-box-type">
+          <span class="content-box-left">项目</span>
+          <span class="content-box-text">Aries-G1.1-中国台湾-00</span>
+        </div>
+        <div class="content-box-right">
+          符合性审查
+        </div>
+      </div>
+    </div>
+    <van-tabbar v-model="active" @change="onChange">
+      <van-tabbar-item name="search" icon="search">搜索</van-tabbar-item>
+      <van-tabbar-item name="toDoCenter" icon="bell">待办中心</van-tabbar-item>
+      <van-tabbar-item name="taskData" icon="underway">任务统计</van-tabbar-item>
+      <van-tabbar-item name="home" icon="manager">我的</van-tabbar-item>
+    </van-tabbar>
+  </div>
 </template>
 
 <script>
   export default {
-    name: 'phoneToDoCenter'
+    name: 'phoneToDoCenter',
+    data() {
+      return {
+        active: 'toDoCenter',
+        value: '',
+        activeTab: ''
+      }
+    },
+    methods: {
+      onChange(value) {
+        if (value == 'search') {
+          this.$router.push({
+            path: '/phoneSearch'
+          })
+        } else if (value == 'taskData') {
+          this.$router.push({
+            path: '/phoneTaskData'
+          })
+        } else if (value == 'home') {
+          this.$router.push({
+            path: '/phoneHome'
+          })
+        }
+      }
+    }
   }
 </script>
 
 <style scoped>
+  ::v-deep .van-tabbar-item--active {
+    color: #00B3BE;
+  }
 
+  .box {
+    padding-top: 0.6rem;
+  }
+
+  .header-search {
+    padding: 0 0.4rem;
+    display: flex;
+    align-items: center;
+    width: 100%;
+  }
+
+  .icon {
+    font-size: 0.66rem;
+  }
+
+  ::v-deep .van-search {
+    padding: 0 0 0 0.2rem;
+  }
+
+  ::v-deep .van-search__action {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 500;
+    color: #040B29;
+    padding: 0 0 0 0.3rem;
+    height: 1.1rem;
+    line-height: 1.1rem;
+  }
+
+  .header-search .van-search {
+    width: 100%;
+    height: 1.1rem;
+  }
+
+  ::v-deep .header-search .van-search .van-search__content {
+    height: 1.1rem;
+    background: #F5F6F7;
+    border-radius: 0.2rem 0.2rem 0.2rem 0.2rem;
+    opacity: 1;
+  }
+
+  ::v-deep .van-search__content .van-cell {
+    line-height: 0.9rem;
+  }
+
+  ::v-deep .van-field__body {
+    font-size: 0.4rem;
+  }
+
+  ::v-deep .van-field__left-icon .van-icon {
+    font-size: 0.46rem !important;
+    font-weight: 600 !important;
+  }
+
+  .content {
+    margin-top: 0.38rem;
+    position: relative;
+  }
+
+  ::v-deep .van-tabs__line {
+    background-color: #00B3BE;
+  }
+
+  ::v-deep .van-tab {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #868A9A;
+    flex: none;
+    margin-right: 0.2rem;
+  }
+
+  ::v-deep .van-tab--active {
+    font-size: 0.38rem;
+    font-family: PingFang SC-Medium, PingFang SC;
+    font-weight: 600;
+    color: #040B29;
+  }
+
+  ::v-deep .van-tabs {
+    padding: 0 0.4rem;
+    width: calc(100% - 1rem);
+  }
+
+  .search-right {
+    position: absolute;
+    right: 0.4rem;
+    top: 0.07rem;
+  }
+
+  .search-right-icon {
+    font-size: 0.48rem;
+  }
+
+  .content-box {
+    padding: 0.4rem 0.4rem;
+    box-sizing: border-box;
+    background: #F7F7F8;
+  }
+
+  .content-box-content {
+    padding: 0.3rem 0.28rem;
+    background: #fff;
+    border-radius: 0.2rem;
+    position: relative;
+    margin-bottom: 0.4rem;
+  }
+
+  .content-box-title {
+    font-family: PingFang SC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #040B29;
+    font-size: 0.38rem;
+  }
+
+  .content-box-type {
+    font-size: 0.32rem;
+    font-family: PingFang SC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #41475E;
+    display: flex;
+  }
+
+  .content-box-left {
+    width: 1rem;
+    display: inline-block;
+  }
+
+  .content-box-text {
+    margin-left: 0.3rem;
+  }
+
+  .content-box-right {
+    padding: 0.16rem 0.4rem;
+    background: #00B3BE;
+    display: inline-block;
+    font-size: 0.32rem;
+    border-radius: 0.14rem;
+    color: #fff;
+    position: absolute;
+    right: 0.28rem;
+    top: 0.3rem;
+  }
 </style>
\ No newline at end of file