diff --git a/frontend/src/i18n/en-US.js b/frontend/src/i18n/en-US.js
index cececec2f33ec130d18935da73ea2c2c14a3d80c..8867515e7db6157597bc290757a150e93ab2a212 100644
--- a/frontend/src/i18n/en-US.js
+++ b/frontend/src/i18n/en-US.js
@@ -101,6 +101,10 @@ export default {
     'recent': 'Recent Report',
     'search_by_name': 'Search by Name',
     'test_name': 'Test',
+    'test_overview': 'Test Overview',
+    'test_request_statistics': 'Test Request Statistics',
+    'test_error_log': 'Test Error Log',
+    'test_log_details': 'Test Log Details'
   },
   load_test: {
     'recent': 'Recent Tests',
diff --git a/frontend/src/i18n/zh-CN.js b/frontend/src/i18n/zh-CN.js
index 5a68c7f63bf01e6dc7317b64e029203b9b9bdf28..e681e879d40c86f51415c844660fe8ac48c4c4c6 100644
--- a/frontend/src/i18n/zh-CN.js
+++ b/frontend/src/i18n/zh-CN.js
@@ -101,6 +101,10 @@ export default {
     'recent': '最近的报告',
     'search_by_name': '根据名称搜索',
     'test_name': '所属测试',
+    'test_overview': '测试概览',
+    'test_request_statistics': '请求统计',
+    'test_error_log': '错误记录',
+    'test_log_details': '日志详情'
   },
   load_test: {
     'recent': '最近的测试',
diff --git a/frontend/src/performance/components/report/AllTestReport.vue b/frontend/src/performance/components/report/AllTestReport.vue
index 6ff6903ee7593016ae33f932cfd047f8e2c4df3d..0048c5902f3f83f52a5354fe0dd8d6455dc7a294 100644
--- a/frontend/src/performance/components/report/AllTestReport.vue
+++ b/frontend/src/performance/components/report/AllTestReport.vue
@@ -48,11 +48,11 @@
             </template>
           </el-table-column>
           <el-table-column
-            width="150"
+            width="200"
             :label="$t('commons.operating')">
             <template slot-scope="scope">
-              <el-button @click="handleEdit(scope.row)" type="primary" icon="el-icon-edit" size="mini" circle/>
-              <el-button @click="handleDelete(scope.row)" type="danger" icon="el-icon-delete" size="mini" circle/>
+              <el-button @click="handleEdit(scope.row)" type="primary" size="mini">查看</el-button>
+              <el-button @click="handleDelete(scope.row)" type="danger" size="mini">删除</el-button>
             </template>
           </el-table-column>
         </el-table>
@@ -129,8 +129,10 @@
       handleSelectionChange(val) {
         this.multipleSelection = val;
       },
-      handleEdit() {
-
+      handleEdit(testPlan) {
+        this.$router.push({
+          path: '/reportView/' + testPlan.id
+        })
       },
       handleDelete(report) {
         this.$alert(this.$t('load_test.delete_confirm') + report.name + "？", '', {
diff --git a/frontend/src/performance/components/report/ReportView.vue b/frontend/src/performance/components/report/ReportView.vue
new file mode 100644
index 0000000000000000000000000000000000000000..86a37dbcd22a2ce32040e7521c72cb3f9ddb59c5
--- /dev/null
+++ b/frontend/src/performance/components/report/ReportView.vue
@@ -0,0 +1,57 @@
+<template>
+  <div v-loading="result.loading">
+    <div class="main-content">
+      <el-card>
+        <el-row>
+
+        </el-row>
+
+        <el-tabs v-model="active" type="border-card" :stretch="true">
+          <el-tab-pane :label="$t('report.test_overview')">
+            <ms-report-test-overview />
+          </el-tab-pane>
+          <el-tab-pane :label="$t('report.test_request_statistics')">
+            <ms-report-request-statistics />
+          </el-tab-pane>
+          <el-tab-pane :label="$t('report.test_error_log')">
+            <ms-report-error-log />
+          </el-tab-pane>
+          <el-tab-pane :label="$t('report.test_log_details')">
+            <ms-report-log-details />
+          </el-tab-pane>
+        </el-tabs>
+
+      </el-card>
+    </div>
+  </div>
+</template>
+
+<script>
+  import MsReportErrorLog from './components/ErrorLog';
+  import MsReportLogDetails from './components/LogDetails';
+  import MsReportRequestStatistics from './components/RequestStatistics';
+  import MsReportTestOverview from './components/TestOverview';
+
+  export default {
+    name: "ReportView",
+    components: {
+      MsReportErrorLog,
+      MsReportLogDetails,
+      MsReportRequestStatistics,
+      MsReportTestOverview
+    },
+    data() {
+      return {
+        result: {},
+        active: '0'
+      }
+    },
+    methods: {
+
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>
diff --git a/frontend/src/performance/components/report/components/ErrorLog.vue b/frontend/src/performance/components/report/components/ErrorLog.vue
new file mode 100644
index 0000000000000000000000000000000000000000..7097c1ced82ee7a77490454573f61d54cb3f0a8d
--- /dev/null
+++ b/frontend/src/performance/components/report/components/ErrorLog.vue
@@ -0,0 +1,15 @@
+<template>
+  <div>
+    Errorlog
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "ErrorLog"
+  }
+</script>
+
+<style scoped>
+
+</style>
diff --git a/frontend/src/performance/components/report/components/LogDetails.vue b/frontend/src/performance/components/report/components/LogDetails.vue
new file mode 100644
index 0000000000000000000000000000000000000000..10c7200afd8bd3ed89cbf940abc251d20acc6c4a
--- /dev/null
+++ b/frontend/src/performance/components/report/components/LogDetails.vue
@@ -0,0 +1,15 @@
+<template>
+  <div>
+    LogDetails
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "LogDetails"
+  }
+</script>
+
+<style scoped>
+
+</style>
diff --git a/frontend/src/performance/components/report/components/RequestStatistics.vue b/frontend/src/performance/components/report/components/RequestStatistics.vue
new file mode 100644
index 0000000000000000000000000000000000000000..e96bbf926142807c14e5812c5efc5d2cb307d2f4
--- /dev/null
+++ b/frontend/src/performance/components/report/components/RequestStatistics.vue
@@ -0,0 +1,15 @@
+<template>
+  <div>
+    RequestStatistics
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "RequestStatistics"
+  }
+</script>
+
+<style scoped>
+
+</style>
diff --git a/frontend/src/performance/components/report/components/TestOverview.vue b/frontend/src/performance/components/report/components/TestOverview.vue
new file mode 100644
index 0000000000000000000000000000000000000000..54af3bb2fe5847340da2759dda9f53330d736b44
--- /dev/null
+++ b/frontend/src/performance/components/report/components/TestOverview.vue
@@ -0,0 +1,15 @@
+<template>
+  <div>
+    TestOverview
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "TestOverview"
+  }
+</script>
+
+<style scoped>
+
+</style>
diff --git a/frontend/src/performance/components/router/router.js b/frontend/src/performance/components/router/router.js
index fb8f7a42618f67228760d4b304dd79cc84f8a344..8334d96200b21c2a3866e0f0d0d8cb9722698847 100644
--- a/frontend/src/performance/components/router/router.js
+++ b/frontend/src/performance/components/router/router.js
@@ -15,6 +15,7 @@ import PersonSetting from "../settings/personal/PersonSetting";
 import SystemWorkspace from "../settings/system/SystemWorkspace";
 import MsChart from "../project/MsChart";
 import AllTestReport from "../report/AllTestReport";
+import ReportView from "../report/ReportView";
 
 Vue.use(VueRouter);
 
@@ -115,7 +116,21 @@ const router = new VueRouter({
       components: {
         content: MsChart
       }
-    }
+    },
+    {
+      path: "/reportView/:reportId",
+      name: "ReportView",
+      components: {
+        content: ReportView
+      },
+      props: {
+        content: (route) => {
+          return {
+            ...route.params
+          }
+        }
+      }
+    },
   ]
 });