通知单管理-封装全局删除对话框

src/components/DeleteDialog/index.vue

@@ -22,23 +22,30 @@
   <el-dialog
       class="my_dialog__header_deep"
       v-model="dialogVisible"
-      title="提示"
+
       align-center
       :before-close="cancel"
-      style="width: 400px;height: 195px;margin-top: 300px" :fullscreen="true"
+      style="width: 420px;height: 195px;margin-top: 300px" :fullscreen="true"
   >
     <template #header>
-      <div>提示</div>
-<!--      <div>{{Prompt}}</div>-->
+      <div style="display: flex;">
+        <div>{{cn.reminder}}</div>
+        <div>{{en.reminder}}</div>
+      </div>
     </template>
-    <div style="display: flex;align-items: center;">
-      <el-icon style="color: orange;font-size: 18px;margin:5px"><WarningFilled /></el-icon>
-      <div style="font-size: 14px">{{ content }}</div>
+    <div style="display: flex;flex-direction: column">
+     <div style="display: flex;" >
+       <el-icon style="color: orange;font-size: 18px;margin-right: 12px"><WarningFilled /></el-icon>
+       <div class="contentText" style="font-size: 14px">{{ content }}</div>
+     </div>
+      <div style="display: flex;" >
+        <div class="contentText" style="font-size: 14px">{{ englishContent }}</div>
+      </div>
     </div>
     <template #footer>
       <div style="margin-top: 10px">
-        <el-button class="btn-B" @click="cancel">取消</el-button>
-        <el-button class="btn-A" @click="confirm">确认</el-button>
+        <el-button class="btn-B" @click="cancel">{{cn.cancel}}{{en.cancel}}</el-button>
+        <el-button class="btn-A" @click="confirm">{{cn.confirm}}{{en.confirm}}</el-button>
       </div>
     </template>
   </el-dialog>
@@ -47,7 +54,8 @@
 <script setup>
 import { ref, defineProps, defineEmits, watch } from 'vue';
 import { WarningFilled } from '@element-plus/icons-vue';
-
+import en from '@/locales/Delectdialog/en.json';
+import cn from '@/locales/Delectdialog/cn.json';
 const props = defineProps({
   visible: {
     type: Boolean,
@@ -56,7 +64,11 @@ const props = defineProps({
   content: {
     type: String,
     default: '确定删除该项目吗？'
-  }
+  },
+  englishContent: {
+    type: String,
+    default: 'Are you sure to delete this project?'
+  },
 });
 
 const emits = defineEmits(['confirm', 'cancel']);
@@ -91,8 +103,11 @@ const cancel = () => {
   }
   .el-dialog__footer{
     padding: 0;
-    margin: 20px;
+    margin: 14px;
   }
 }
-
+.contentText{
+  font-size: 14px;
+  color: #5B6373;
+}
 </style>

src/locales/Delectdialog/cn.json

+{
+  "reminder": "提示",
+  "cancel": "取消",
+  "confirm": "确定"
+}

src/locales/Delectdialog/en.json

+{
+  "reminder": "prompt",
+  "cancel": "cancel",
+  "confirm": "confirm"
+}

src/views/controlPlan/controlPlanNotice/notificationManagement/index.vue

@@ -398,6 +398,7 @@
     <DeleteDialog
         :visible="undoDialogVisible"
         :content="Prompt"
+        :english-content="'Are you sure to delete this notice?'"
         @confirm="handleDelete"
         @cancel="hideDeleteDialog"
     />