diff --git a/backend/src/main/java/io/metersphere/track/controller/TestPlanTestCaseController.java b/backend/src/main/java/io/metersphere/track/controller/TestPlanTestCaseController.java
index 7fee29dafe..89dfb0839c 100644
--- a/backend/src/main/java/io/metersphere/track/controller/TestPlanTestCaseController.java
+++ b/backend/src/main/java/io/metersphere/track/controller/TestPlanTestCaseController.java
@@ -95,12 +95,6 @@ public class TestPlanTestCaseController {
         return testPlanTestCaseService.idList(request);
     }
 
-
-    @PostMapping("/list/ids")
-    public List<TestPlanCaseDTO> getTestPlanCaseIds(@RequestBody QueryTestPlanCaseRequest request) {
-        return testPlanTestCaseService.list(request);
-    }
-
     @PostMapping("/edit")
     @MsAuditLog(module = "track_test_case_review", type = OperLogConstants.UPDATE, content = "#msClass.getLogDetails(#testPlanTestCase.id)", msClass = TestPlanTestCaseService.class)
     public void editTestCase(@RequestBody TestPlanTestCaseWithBLOBs testPlanTestCase) {
diff --git a/backend/src/main/java/io/metersphere/track/controller/TestReviewTestCaseController.java b/backend/src/main/java/io/metersphere/track/controller/TestReviewTestCaseController.java
index ef0b56192f..da5de7daa6 100644
--- a/backend/src/main/java/io/metersphere/track/controller/TestReviewTestCaseController.java
+++ b/backend/src/main/java/io/metersphere/track/controller/TestReviewTestCaseController.java
@@ -71,11 +71,6 @@ public class TestReviewTestCaseController {
         return testReviewTestCaseService.get(reviewId);
     }
 
-    @PostMapping("/list/ids")
-    public List<TestReviewCaseDTO> getTestReviewCaseList(@RequestBody QueryCaseReviewRequest request) {
-        return testReviewTestCaseService.getTestCaseReviewDTOList(request);
-    }
-
     @PostMapping("/edit/order")
     public void orderCase(@RequestBody ResetOrderRequest request) {
         testReviewTestCaseService.updateOrder(request);
diff --git a/backend/src/main/java/io/metersphere/track/service/TestReviewTestCaseService.java b/backend/src/main/java/io/metersphere/track/service/TestReviewTestCaseService.java
index 1662c7690c..f472241f06 100644
--- a/backend/src/main/java/io/metersphere/track/service/TestReviewTestCaseService.java
+++ b/backend/src/main/java/io/metersphere/track/service/TestReviewTestCaseService.java
@@ -151,11 +151,6 @@ public class TestReviewTestCaseService {
         testCaseMapper.updateByPrimaryKeySelective(testCase);
     }
 
-    public List<TestReviewCaseDTO> getTestCaseReviewDTOList(QueryCaseReviewRequest request) {
-        request.setOrders(ServiceUtils.getDefaultSortOrder(request.getOrders()));
-        return extTestReviewCaseMapper.list(request);
-    }
-
     public TestReviewCaseDTO get(String reviewId) {
         TestReviewCaseDTO testReviewCaseDTO = extTestReviewCaseMapper.get(reviewId);
         List<TestCaseTestDTO> testCaseTestDTOS = extTestPlanTestCaseMapper.listTestCaseTest(testReviewCaseDTO.getCaseId());
diff --git a/frontend/src/business/components/track/review/view/components/TestReviewTestCaseEdit.vue b/frontend/src/business/components/track/review/view/components/TestReviewTestCaseEdit.vue
index aa19e34aa6..3499191578 100644
--- a/frontend/src/business/components/track/review/view/components/TestReviewTestCaseEdit.vue
+++ b/frontend/src/business/components/track/review/view/components/TestReviewTestCaseEdit.vue
@@ -29,13 +29,16 @@
 
                     <el-col :span="14" class="head-right">
 
-                      <el-button plain size="mini" icon="el-icon-arrow-up"
-                                 :disabled="index + 1 <= 1"
-                                 @click="handlePre()"/>
-                      <span>  {{ index + 1 }}/{{ testCases.length }} </span>
-                      <el-button plain size="mini" icon="el-icon-arrow-down"
-                                 :disabled="index + 1 >= testCases.length"
-                                 @click="handleNext()"/>
+                      <ms-previous-next-button
+                        :index="index"
+                        :page-num="pageNum"
+                        :page-size="pageSize"
+                        :page-total="pageTotal"
+                        :total="total"
+                        @pre="handlePre"
+                        @next="handleNext"
+                        :list="testCases"/>
+
                       <el-divider direction="vertical"></el-divider>
 
                       <el-button type="success" size="mini"
@@ -148,10 +151,12 @@ import FormRichTextItem from "@/business/components/track/case/components/FormRi
 import CustomFiledComponent from "@/business/components/settings/workspace/template/CustomFiledComponent";
 import StepChangeItem from "@/business/components/track/case/components/StepChangeItem";
 import TestCaseStepItem from "@/business/components/track/case/components/TestCaseStepItem";
+import MsPreviousNextButton from "@/business/components/common/components/MsPreviousNextButton";
 
 export default {
   name: "TestReviewTestCaseEdit",
   components: {
+    MsPreviousNextButton,
     TestCaseStepItem,
     StepChangeItem,
     CustomFiledComponent,
@@ -204,6 +209,11 @@ export default {
     isReadOnly: {
       type: Boolean,
       default: false
+    },
+    pageNum: Number,
+    pageSize: {
+      type: Number,
+      default: 1
     }
   },
   computed: {
@@ -212,6 +222,9 @@ export default {
     },
     systemNameMap() {
       return SYSTEM_FIELD_NAME_MAP;
+    },
+    pageTotal() {
+      return Math.ceil(this.total / this.pageSize);
     }
   },
   methods: {
@@ -303,17 +316,27 @@ export default {
       }
     },
     handleNext() {
+      if (this.index === this.testCases.length - 1 && this.pageNum === this.pageTotal) {
+        return;
+      } else if (this.index === this.testCases.length - 1) {
+        this.$emit('nextPage');
+        return;
+      }
       this.index++;
-      this.getTestCase(this.index);
+      this.getTestCase(this.testCases[this.index].id);
     },
     handlePre() {
+      if (this.index === 0 && this.pageNum === 1) {
+        return;
+      } else if (this.index === 0) {
+        this.$emit('prePage');
+        return;
+      }
       this.index--;
-      this.getTestCase(this.index);
+      this.getTestCase(this.testCases[this.index].id);
     },
-    getTestCase(index) {
-      this.testCase = {};
-      let testCase = this.testCases[index];
-      this.result = this.$get("/test/review/case/get/" + testCase.id, response => {
+    getTestCase(id) {
+      this.result = this.$get("/test/review/case/get/" + id, response => {
         let item = {};
         let data = response.data;
         Object.assign(item, data);
@@ -355,35 +378,33 @@ export default {
         });
       })
     },
-    openTestCaseEdit(testCase) {
+    openTestCaseEdit(testCase, tableData) {
       this.showDialog = true;
       this.activeTab = 'detail';
       this.getComments(testCase);
       this.hasTapdId = false;
       this.hasZentaoId = false;
       listenGoBack(this.handleClose);
-      let initFuc = this.initData;
+      let initFuc = this.getTestCase;
+
+      if (tableData) {
+        this.testCases = tableData;
+        for (let i = 0; i < this.testCases.length; i++) {
+          let item = this.testCases[i];
+          if (item.id === testCase.id) {
+            this.index = i;
+            break;
+          }
+        }
+      }
+
       getTemplate('field/template/case/get/relate/', this)
         .then((template) => {
           this.testCaseTemplate = template;
-          initFuc(testCase);
+          initFuc(testCase.id);
         });
     },
-    /* initTest() {
-       this.$nextTick(() => {
-         if (this.testCase.testId && this.testCase.testId !== 'other') {
-           if (this.$refs.apiTestDetail && this.testCase.type === 'api') {
-             this.$refs.apiTestDetail.init();
-           } else if (this.testCase.type === 'performance') {
-             this.$refs.performanceTestDetail.init();
-           } else if (this.testCase.type === 'testcase') {
-             this.$refs.apiCaseConfig.active(this.api);
-           } else if (this.testCase.type === 'automation') {
-              this.$refs.autoScenarioConfig.showAll();
-           }
-         }
-       });
-     },*/
+
     getComments(testCase) {
       let id = '';
       if (testCase) {
@@ -399,17 +420,6 @@ export default {
 
       })
     },
-    initData(testCase) {
-      this.result = this.$post('/test/review/case/list/ids', this.searchParam, response => {
-        this.testCases = response.data;
-        for (let i = 0; i < this.testCases.length; i++) {
-          if (this.testCases[i].id === testCase.id) {
-            this.index = i;
-            this.getTestCase(i);
-          }
-        }
-      });
-    },
     getRelatedTest() {
       if (this.testCase.method === 'auto' && this.testCase.testId && this.testCase.testId !== 'other') {
         this.$get('/' + this.testCase.type + '/get/' + this.testCase.testId, response => {
diff --git a/frontend/src/business/components/track/review/view/components/TestReviewTestCaseList.vue b/frontend/src/business/components/track/review/view/components/TestReviewTestCaseList.vue
index d35d97e47a..33d28af502 100644
--- a/frontend/src/business/components/track/review/view/components/TestReviewTestCaseList.vue
+++ b/frontend/src/business/components/track/review/view/components/TestReviewTestCaseList.vue
@@ -154,8 +154,14 @@
     <test-review-test-case-edit
       ref="testReviewTestCaseEdit"
       :search-param="condition"
+      :page-num="currentPage"
+      :page-size="pageSize"
+      @nextPage="nextPage"
+      @prePage="prePage"
       @refresh="initTableData"
+      :test-cases="tableData"
       :is-read-only="isReadOnly"
+      :total="total"
       @refreshTable="search"/>
 
 
@@ -333,6 +339,18 @@ export default {
     this.getVersionOptions();
   },
   methods: {
+    nextPage() {
+      this.currentPage++;
+      this.initTableData(() => {
+        this.$refs.testReviewTestCaseEdit.openTestCaseEdit(this.tableData[0], this.tableData);
+      });
+    },
+    prePage() {
+      this.currentPage--;
+      this.initTableData(() => {
+        this.$refs.testReviewTestCaseEdit.openTestCaseEdit(this.tableData[this.tableData.length - 1], this.tableData);
+      });
+    },
     initTableHeader() {
       this.result.loading = true;
       this.fields = getTableHeaderWithCustomFields(this.tableHeaderKey, []);
@@ -343,7 +361,7 @@ export default {
       const list = deepClone(this.tableLabel);
       this.$refs.headerCustom.open(list);
     },
-    initTableData() {
+    initTableData(callback) {
       initCondition(this.condition, this.condition.selectAll);
       if (this.reviewId) {
         this.condition.reviewId = this.reviewId;
@@ -365,13 +383,16 @@ export default {
           this.total = data.itemCount;
           this.tableData = data.listObject;
           this.tableClear();
+          if (callback) {
+            callback();
+          }
         });
       }
 
     },
     showDetail(row, event, column) {
       this.isReadOnly = true;
-      this.$refs.testReviewTestCaseEdit.openTestCaseEdit(row);
+      this.$refs.testReviewTestCaseEdit.openTestCaseEdit(row, this.tableData);
     },
     refresh() {
       this.condition = {components: TEST_CASE_CONFIGS};
@@ -396,7 +417,7 @@ export default {
     },
     handleEdit(testCase, index) {
       this.isReadOnly = false;
-      this.$refs.testReviewTestCaseEdit.openTestCaseEdit(testCase);
+      this.$refs.testReviewTestCaseEdit.openTestCaseEdit(testCase, this.tableData);
     },
     handleDelete(testCase) {
       this.$alert(this.$t('test_track.plan_view.confirm_cancel_relevance') + ' ' + testCase.name + " ？", '', {
@@ -463,7 +484,7 @@ export default {
     startReview() {
       if (this.tableData.length !== 0) {
         this.isReadOnly = false;
-        this.$refs.testReviewTestCaseEdit.openTestCaseEdit(this.tableData[0]);
+        this.$refs.testReviewTestCaseEdit.openTestCaseEdit(this.tableData[0], this.tableData);
       } else {
         this.$warning(this.$t('test_track.review.no_link_case'));
       }