diff --git a/frontend/src/business/components/track/case/components/TestCaseEdit.vue b/frontend/src/business/components/track/case/components/TestCaseEdit.vue
index 0b38e26793..5d468b1ee3 100644
--- a/frontend/src/business/components/track/case/components/TestCaseEdit.vue
+++ b/frontend/src/business/components/track/case/components/TestCaseEdit.vue
@@ -154,6 +154,8 @@
                                 :tree-nodes="treeNodes"></test-case-version-diff>
 
       </el-dialog>
+
+      <version-create-other-info-select @confirmOtherInfo="confirmOtherInfo" ref="selectPropDialog"></version-create-other-info-select>
     </div>
   </el-card>
 
@@ -723,21 +725,11 @@ export default {
       this.dialogFormVisible = false;
     },
     saveCase(callback) {
-      let isValidate = true;
-      this.$refs['caseFrom'].validate((valid) => {
-        if (!valid) {
-          isValidate = false;
-          return false;
-        }
-      });
-      this.$refs['customFieldForm'].validate((valid) => {
-        if (!valid) {
-          isValidate = false;
-          return false;
-        }
-      });
-      if (isValidate) {
+      if (this.validateForm()) {
         this._saveCase(callback);
+      }else{
+        this.$refs.versionHistory.loading = false;
+        this.$refs.selectPropDialog.close();
       }
     },
     _saveCase(callback) {
@@ -968,7 +960,6 @@ export default {
           this.currentProjectId = getCurrentProjectID();
         }
         this.versionData = response.data;
-        this.$refs.versionHistory.cancelOtherInfo();
         this.$refs.versionHistory.loading = false;
       });
     },
@@ -1012,15 +1003,35 @@ export default {
         });
       }
     },
+    validateForm() {
+      let isValidate = true;
+      this.$refs['caseFrom'].validate((valid) => {
+        if (!valid) {
+          isValidate = false;
+          return false;
+        }
+      });
+      this.$refs['customFieldForm'].validate((valid) => {
+        if (!valid) {
+          isValidate = false;
+          return false;
+        }
+      });
+      return isValidate;
+    },
     async create(row) {
-      // 创建新版本
-      this.form.versionId = row.id;
-      let hasOtherInfo = await this.hasOtherInfo();
-      if (hasOtherInfo) {
-        this.$refs.versionHistory.loading = false;
-        this.$refs.versionHistory.showOtherInfo();
+      if (this.validateForm()) {
+        // 创建新版本
+        this.form.versionId = row.id;
+        let hasOtherInfo = await this.hasOtherInfo();
+        if (hasOtherInfo) {
+          this.$refs.versionHistory.loading = false;
+          this.$refs.selectPropDialog.open();
+        } else {
+          this.saveCase();
+        }
       } else {
-        this.saveCase();
+        this.$refs.versionHistory.loading = false;
       }
     },
     del(row) {
diff --git a/frontend/src/business/components/track/case/components/VersionCreateOtherInfoSelect.vue b/frontend/src/business/components/track/case/components/VersionCreateOtherInfoSelect.vue
index 88b40099d9..174d0d424f 100644
--- a/frontend/src/business/components/track/case/components/VersionCreateOtherInfoSelect.vue
+++ b/frontend/src/business/components/track/case/components/VersionCreateOtherInfoSelect.vue
@@ -1,13 +1,12 @@
 <template>
-  <div>
+  <!--创建新版本选择其他信息对话框-->
+  <el-dialog
+    :title="$t('commons.sync_other_info')"
+    :visible.sync="visible"
+    :show-close="false"
+    width="30%"
+  >
     <el-form ref="form" :model="form" label-width="10px" label-position="left">
-      <el-row>
-        <el-col :span="24">
-          <el-form-item>
-            <span>{{ $t('test_track.case.sync_to_new_version') }}</span>
-          </el-form-item>
-        </el-col>
-      </el-row>
       <el-row>
         <el-col :span="6">
           <el-form-item>
@@ -42,14 +41,12 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <el-row>
-        <el-form-item style="float:right">
-          <el-button size="small" @click="$emit('cancelOtherInfo')">{{ $t('commons.cancel') }}</el-button>
-          <el-button type="primary" size="small" @click="confirmOtherInfo">{{ $t('commons.confirm') }}</el-button>
-        </el-form-item>
-      </el-row>
     </el-form>
-  </div>
+    <span slot="footer" class="dialog-footer">
+        <el-button @click="visible = false;">{{ $t('commons.cancel') }}</el-button>
+        <el-button type="primary" @click="confirmOtherInfo">{{ $t('commons.confirm') }}</el-button>
+    </span>
+  </el-dialog>
 </template>
 
 <script>
@@ -58,6 +55,7 @@ export default {
   name: "VersionCreateOtherInfoSelect",
   data() {
     return {
+      visible: false,
       form: {
         remark: false,
         relateTest: false,
@@ -66,11 +64,17 @@ export default {
         archive: false,
         dependency: false,
       }
-
     };
   },
   methods: {
+    open() {
+      this.visible = true;
+    },
+    close() {
+      this.visible = false;
+    },
     confirmOtherInfo() {
+      this.visible = false;
       this.$emit("confirmOtherInfo", this.form);
     }
   }