删除测试计划确认

frontend/src/business/components/common/components/MsDeleteConfirm.vue

@@ -0,0 +1,83 @@
+<template>
+  <el-dialog :title="title"
+             :visible.sync="dialogVisible"
+             class="delete-confirm" >
+
+    <el-row>
+      <el-col>
+        <span>{{$t('commons.delete_confirm')}}</span>
+        <span class="delete-tip"> DELETE-{{record.name}}</span>
+        <br/>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :span="15">
+        <el-input v-model="value" :placeholder="$t('commons.input_content')"/>
+      </el-col>
+    </el-row>
+
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="dialogVisible = false">{{$t('commons.cancel')}}</el-button>
+      <el-button type="primary" @click="confirm">{{$t('commons.confirm')}}</el-button>
+    </span>
+
+  </el-dialog>
+</template>
+
+<script>
+    export default {
+      name: "MsDeleteConfirm",
+      data() {
+        return {
+          dialogVisible: false,
+          value: '',
+          record: {},
+        }
+      },
+      props: {
+        title: {
+          type: String,
+          default() {
+            return this.$t('commons.title')
+          }
+        }
+      },
+      methods: {
+        open(record) {
+          this.dialogVisible = true;
+          this.value = '';
+          this.record = record;
+        },
+        confirm() {
+          if (this.value.trim() != 'DELETE-' + this.record.name) {
+            this.$warning(this.$t('commons.incorrect_input'));
+            return;
+          }
+          this.$emit('delete', this.record);
+          this.dialogVisible = false;
+        }
+      }
+    }
+</script>
+
+<style scoped>
+
+  .delete-confirm >>> .el-dialog {
+    width: 500px;
+  }
+
+  .delete-confirm .el-dialog:first-child {
+    margin-bottom: 10px;
+  }
+
+  .delete-confirm .el-row:first-child {
+    margin-bottom: 20px;
+  }
+
+  .delete-tip {
+    font-style: italic;
+    font-weight: bold;
+  }
+
+
+</style>

frontend/src/business/components/track/plan/components/TestPlanList.vue

@@ -99,6 +99,7 @@
 
     <test-report-template-list @openReport="openReport" ref="testReporTtemplateList"/>
     <test-case-report-view @refresh="initTableData" ref="testCaseReportView"/>
+    <ms-delete-confirm :title="$t('test_track.plan.plan_delete')" @delete="_handleDelete" ref="deleteConfirm"/>
 
   </el-card>
 </template>
@@ -115,10 +116,12 @@
   import {_filter, _sort} from "../../../../../common/js/utils";
   import TestReportTemplateList from "../view/comonents/TestReportTemplateList";
   import TestCaseReportView from "../view/comonents/report/TestCaseReportView";
+  import MsDeleteConfirm from "../../../common/components/MsDeleteConfirm";
 
   export default {
       name: "TestPlanList",
       components: {
+        MsDeleteConfirm,
         TestCaseReportView,
         TestReportTemplateList,
         PlanStageTableItem,
@@ -185,14 +188,7 @@
           });
         },
         handleDelete(testPlan) {
-          this.$alert(this.$t('test_track.plan.plan_delete_confirm') + testPlan.name + "？", '', {
-            confirmButtonText: this.$t('commons.confirm'),
-            callback: (action) => {
-              if (action === 'confirm') {
-                this._handleDelete(testPlan);
-              }
-            }
-          });
+          this.$refs.deleteConfirm.open(testPlan);
         },
         _handleDelete(testPlan) {
           let testPlanId = testPlan.id;

frontend/src/i18n/en-US.js

@@ -96,7 +96,8 @@ export default {
     'remove_success': 'Remove Success',
     'tips': 'The authentication information has expired, please login again',
     'not_performed_yet': 'Not performed yet',
-
+    'incorrect_input': 'Incorrect input',
+    'delete_confirm': 'Please enter the following to confirm deletion:',
   },
   workspace: {
     'create': 'Create Workspace',
@@ -447,6 +448,7 @@ export default {
       plan_status_running: "Starting",
       plan_status_completed: "Completed",
       plan_delete_confirm: "All use cases under this plan will be deleted,confirm delete test plan: ",
+      plan_delete: "Delete test plan",
     },
     module: {
       search: "Search module",

frontend/src/i18n/zh-CN.js

@@ -95,7 +95,8 @@ export default {
     'remove_success': '移除成功',
     'tips': '认证信息已过期，请重新登录',
     'not_performed_yet': '尚未执行',
-
+    'incorrect_input': '输入内容不正确',
+    'delete_confirm': '请输入以下内容，确认删除：',
   },
   workspace: {
     'create': '创建工作空间',
@@ -445,6 +446,7 @@ export default {
       plan_status_running: "进行中",
       plan_status_completed: "已完成",
       plan_delete_confirm: "将删除该测试计划下所有用例，确认删除测试计划: ",
+      plan_delete: "删除计划",
     },
     module: {
       search: "搜索模块",

frontend/src/i18n/zh-TW.js

@@ -95,6 +95,8 @@ export default {
     'remove_success': '移除成功',
     'tips': '认認證資訊已過期,請重新登入',
     'not_performed_yet': '尚未執行',
+    'incorrect_input': '輸入內容不正確',
+    'delete_confirm': '請輸入以下內容，確認刪除：',
   },
   workspace: {
     'create': '創建工作空間',
@@ -445,6 +447,7 @@ export default {
       plan_status_running: "進行中",
       plan_status_completed: "已完成",
       plan_delete_confirm: "將刪除該測試計劃下所有用例，確認刪除測試計劃: ",
+      plan_delete: "刪除計劃",
     },
     module: {
       search: "搜索模塊",