diff --git a/nezha-fronted/src/assets/css/common/tableCommon.scss b/nezha-fronted/src/assets/css/common/tableCommon.scss
index 4833baf2d..4e47979db 100644
--- a/nezha-fronted/src/assets/css/common/tableCommon.scss
+++ b/nezha-fronted/src/assets/css/common/tableCommon.scss
@@ -325,6 +325,25 @@
         &>.table-operation-item:hover {
           background-color: $--button-primary-hover-background-color;
         }
+        .delete-button.table-operation-item {
+          justify-content: center;
+          align-items: center;
+          width: 30px;
+          margin-right: 10px;
+          border: none;
+          border-radius: $--button-border-radius;
+          background-color: $--button-primary-background-color;
+          opacity: 1;
+          cursor: pointer;
+          transition: all .2s;
+          i {
+            color: $--button-primary-color;
+            font-size: 12px;
+          }
+        }
+        .delete-button.table-operation-item:hover {
+          background-color: $--button-primary-hover-background-color;
+        }
         .table-operation-item.table-operation-item--more {
           justify-content: center;
           align-items: center;
diff --git a/nezha-fronted/src/assets/css/components/common/deleteButton.scss b/nezha-fronted/src/assets/css/components/common/deleteButton.scss
index 564a45285..5b0dc6710 100644
--- a/nezha-fronted/src/assets/css/components/common/deleteButton.scss
+++ b/nezha-fronted/src/assets/css/components/common/deleteButton.scss
@@ -97,5 +97,6 @@
   }
   .check-title{
     color: $--color-text-regular;
+    vertical-align: middle;
   }
 }
diff --git a/nezha-fronted/src/assets/css/components/common/table/settings/backupsTable.scss b/nezha-fronted/src/assets/css/components/common/table/settings/backupsTable.scss
index 32bc674c0..22db0c342 100644
--- a/nezha-fronted/src/assets/css/components/common/table/settings/backupsTable.scss
+++ b/nezha-fronted/src/assets/css/components/common/table/settings/backupsTable.scss
@@ -1,73 +1,74 @@
-.backups-table{
+.backups-table {
   .nz-table-list {
-      .el-table__row{
-        td:last-of-type{
-          // border-bottom: 1px solid $--border-color-light !important;
-          border: none !important;
-        }
+    .el-table__row {
+      td:last-of-type {
+        // border-bottom: 1px solid $--border-color-light !important;
+        border: none !important;
       }
+    }
   }
-    .el-table:not(.chart-table) {
-      .table-operation-items {
+  .el-table:not(.chart-table) {
+    .table-operation-items {
+      display: flex;
+      justify-content: center;
+      .table-operation-item.delete-button {
+        background: $--background-color-2 !important;
+        border: 1px solid $--border-color-base !important;
+      }
+      .table-operation-edit {
+        background: $--background-color-2;
+        border: 1px solid $--border-color-base;
+        border-radius: 2px;
+        width: 30px;
+        height: 22px;
+        i {
+          font-size: 12px !important;
+        }
+      }
+      .table-operation-del {
+        background: $--background-color-2;
+        border: 1px solid $--border-color-base;
+        border-radius: 2px;
+        width: 22px;
+        height: 22px;
+        i {
+          font-size: 12px !important;
+        }
+      }
+      .table-operation-button {
+        border: none;
+        background-color: $--color-primary;
+        color: $--button-primary-color;
         display: flex;
+        text-align: center;
+        line-height: 22px;
         justify-content: center;
-        
-        .table-operation-edit {
-          background: $--background-color-2;
-          border: 1px solid $--border-color-base;
-          border-radius: 2px;
-          width: 30px;
-          height: 22px;
-          i{
-            font-size: 12px !important;
-          }
-        }
-        .table-operation-del{
-          background: $--background-color-2;
-          border: 1px solid $--border-color-base;
-          border-radius: 2px;
-          width: 22px;
-          height: 22px;
-          i{
-            font-size: 12px !important;
-          }
-        }
-        .table-operation-button {
-          border: none;
-          background-color: $--color-primary;
-          color: $--button-primary-color;
-          display: flex;
-          text-align: center;
-          line-height: 22px;
-          justify-content: center;
-          align-items: center;
-          height: 22px;
-          width: 30px;
-          padding: 0 5px 0 5px;
-          margin-right: 10px;
-          cursor: pointer;
-          i.nz-icon-beifen.nz-icon::before {
-            font-size: 12px;
-          }
+        align-items: center;
+        height: 22px;
+        width: 30px;
+        padding: 0 5px 0 5px;
+        margin-right: 10px;
+        cursor: pointer;
+        i.nz-icon-beifen.nz-icon::before {
+          font-size: 12px;
         }
       }
     }
+  }
 
-    .nz-icon-shujubeifenhuifu::before{
-      font-size: 12px;
-    }
-    .el-table--border td:first-child .cell{
-      padding-left: 20px !important;
-    }
+  .nz-icon-shujubeifenhuifu::before {
+    font-size: 12px;
+  }
+  .el-table--border td:first-child .cell {
+    padding-left: 20px !important;
+  }
 
-
-
-    .el-table__empty-block{
-      .el-table__empty-text{
-        .table-no-data{
-          height: 200px;
-          padding-top: 70px;
-        }
+  .el-table__empty-block {
+    .el-table__empty-text {
+      .table-no-data {
+        height: 200px;
+        padding-top: 70px;
       }
     }
+  }
 }
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/IpDetails.vue b/nezha-fronted/src/components/common/bottomBox/tabs/IpDetails.vue
index 3f39c9aaf..f89773410 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/IpDetails.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/IpDetails.vue
@@ -39,6 +39,7 @@
                 <delete-button
                   ref="deleteButton"
                   :from="'ipDetails'"
+                  :single="false"
                   :type="'link'"
                   :title="$t('overall.batchDel')"
                   v-has="'ipam_delete'"
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
index 1caa8a11b..1d17afd0a 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
@@ -29,6 +29,7 @@
         <delete-button
           ref="deleteButton"
           :from="'alertMessageTab'"
+          :single="false"
           :forceDeleteShow="false"
           :clickFunction="openDelMessageBox"
           :delete-objs="batchDeleteObjs"
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue
index 4a8bc2760..eca2d3daa 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue
@@ -58,6 +58,7 @@
                 <delete-button
                   ref="deleteButton"
                   :from="'cabinetTab'"
+                  :single="false"
                   :forceDeleteShow="false"
                   :type="'link'"
                   :title="$t('overall.batchDel')"
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
index e78e72252..7fcfb885b 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
@@ -34,6 +34,7 @@
         </export-excel>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'endpoint'"
           :forceDeleteShow="false"
           :delete-objs="batchDeleteObjs"
diff --git a/nezha-fronted/src/components/common/deleteButton.vue b/nezha-fronted/src/components/common/deleteButton.vue
index e0080ed42..60db4dd67 100644
--- a/nezha-fronted/src/components/common/deleteButton.vue
+++ b/nezha-fronted/src/components/common/deleteButton.vue
@@ -5,7 +5,7 @@
         <span><i class="nz-icon nz-icon-delete" ></i></span>
       </button>
     </div>
-
+    <button v-if="this.type === 'btn'" class="table-operation-item delete-button" :id="id" @click="batchDelete" :title="$t('overall.delete')"><i class="nz-icon nz-icon-delete"></i></button>
     <div v-if="this.type === 'link'" :id="id" @click="batchDelete" :title="$t('overall.delete')">
       <span><i class="nz-icon nz-icon-delete" ></i>{{title}}</span>
     </div>
@@ -98,6 +98,7 @@ export default {
       dialogVisible: false,
       idShow: true,
       idStr: [],
+      backupName: [],
       deleteData: [],
       forceDelete: 0,
       batchDeleteObjs: [],
@@ -126,40 +127,73 @@ export default {
     deleteTitle: {
       type: String,
       default: 'project.topology.data'
+    },
+    single: {
+      type: Boolean
     }
   },
+  inject: ['getTableData'],
   methods: {
     batchDelete: function () {
-      this.$emit('before')
-      if (this.deleteObjs.length < 1) return
-      if (this.clickFunction) {
-        this.clickFunction()
-        return
+      if (!this.single) {
+        this.$emit('before')
+        if (this.deleteObjs.length < 1) return
+        if (this.clickFunction) {
+          this.clickFunction()
+          return
+        }
+        this.idShow = true
+        this.prepare = true
+        this.process = false
+        this.finish = false
+        this.forceDelete = 0
+        this.deleteData = this.$loadsh.cloneDeep(this.deleteObjs).map(item => {
+          item.type = this.from
+          return item
+        })
+        this.checkAll = true
+        this.idStr = this.deleteData.map(item => item.id)
+        this.dialogVisible = true
+      } else {
+        setTimeout(() => {
+          this.$emit('before')
+          if (this.deleteObjs.length < 1) return
+          if (this.clickFunction) {
+            this.clickFunction()
+            return
+          }
+          this.idShow = true
+          this.prepare = true
+          this.process = false
+          this.finish = false
+          this.forceDelete = 0
+          this.deleteData = this.$loadsh.cloneDeep(this.deleteObjs).map(item => {
+            item.type = this.from
+            return item
+          })
+          this.checkAll = true
+          this.idStr = this.deleteData.map(item => item.id)
+          if (this.from == 'backup') {
+            this.backupName = this.deleteData.map(item => item.fileName)
+          }
+          this.dialogVisible = true
+        }, 50)
       }
-      this.idShow = true
-      this.prepare = true
-      this.process = false
-      this.finish = false
-      this.forceDelete = 0
-      this.deleteData = this.$loadsh.cloneDeep(this.deleteObjs).map(item => {
-        item.type = this.from
-        return item
-      })
-      this.checkAll = true
-      this.idStr = this.deleteData.map(item => item.id)
-      this.dialogVisible = true
     },
     handleClose () {
       this.dialogVisible = false
       if (this.finish) {
         this.$emit('after')
+        if (this.single) {
+          this.getTableData()
+        }
       }
     },
     batchDeleteYes () {
       if (!this.forceDeleteShow) {
         this.forceDelete = 1
       }
-      this.$delete(this.api + `?ids=${this.idStr.join(',')}&force=${this.forceDelete}`).then(res => {
+      this.$delete(this.api + `?ids=${this.idStr.join(',')}&force=${this.forceDelete}` + `${this.from == 'backup' ? '&filename=' + this.backupName : ''}`).then(res => {
         this.idShow = false
         this.prepare = false
         this.process = true
diff --git a/nezha-fronted/src/components/common/mixin/dataList.js b/nezha-fronted/src/components/common/mixin/dataList.js
index 241ec4bcd..c8088530a 100644
--- a/nezha-fronted/src/components/common/mixin/dataList.js
+++ b/nezha-fronted/src/components/common/mixin/dataList.js
@@ -45,6 +45,11 @@ export default {
       searchCheckBox: {}
     }
   },
+  provide () {
+    return {
+      getTableData: this.getTableData
+    }
+  },
   methods: {
     sortableShow: tableSet.sortableShow,
     propTitle: tableSet.propTitle,
diff --git a/nezha-fronted/src/components/common/mixin/table.js b/nezha-fronted/src/components/common/mixin/table.js
index 250d75e46..db6efc6d4 100644
--- a/nezha-fronted/src/components/common/mixin/table.js
+++ b/nezha-fronted/src/components/common/mixin/table.js
@@ -27,14 +27,24 @@ export default {
     return {
       operationWidth: '165', // 操作列宽
       orderBy: null,
-      severityDataWeight: this.$store.getters.severityDataWeight
+      severityDataWeight: this.$store.getters.severityDataWeight,
+      singleDelete: []
     }
   },
   methods: {
     tableOperation ([command, row, param]) {
       switch (command) {
+        // case 'delete': {
+        //   this.$emit('del', row)
+        //   break
+        // }
         case 'delete': {
-          this.$emit('del', row)
+          if (this.singleDelete.length === 0) {
+            this.singleDelete.push(row)
+          } else {
+            this.singleDelete = []
+            this.singleDelete.push(row)
+          }
           break
         }
         case 'ack': {
diff --git a/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue b/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
index cdc2cd63a..cc7f4248c 100644
--- a/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
+++ b/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
@@ -112,7 +112,23 @@
             </div>
             <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
               <!--            <el-dropdown-item :command="['showText', scope.row]"><i class="nz-icon nz-icon-guzhangshuju"></i><span class="operation-dropdown-text">{{$t('alert.config.trbShot')}}</span></el-dropdown-item>-->
-              <el-dropdown-item v-has="'alertMessage_view'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+              <!-- <el-dropdown-item v-has="'alertMessage_view'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+              <el-dropdown-item v-has="'alertMessage_view'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'alertMessage'"
+                  :forceDeleteShow="false"
+                  :deleteTitle="'alert.alertMessage'"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="alert-msg-delete"
+                  v-has="'alertMessage_expired'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
               <el-dropdown-item v-has="'alertSilence_add'" :command="['fastSilence', scope.row, 'alertMessage']"><i class="nz-icon nz-icon-fast-silence"></i><span class="operation-dropdown-text">{{$t('overall.silenceAlert')}}</span></el-dropdown-item>
               <el-dropdown-item v-has="'alertMessage_expired'" :disabled="scope.row.ack === 1" :command="['ack', scope.row]"><i class="nz-icon nz-icon-queren"></i><span class="operation-dropdown-text">{{$t('overall.acknowledge')}}</span></el-dropdown-item>
             </el-dropdown-menu>
@@ -151,10 +167,11 @@ import { calcDurationByStringTimeB } from '../../js/tools'
 import { alertMessage as alertMessageConstant } from '@/components/common/js/constants'
 import alertLabelMixin from '@/components/common/mixin/alertLabelMixin'
 import alertMessageLabelMixin from '@/components/common/alert/alertMessageLabelMixin'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'alertMessageTable',
   components: {
-    alertRuleInfo: alertRuleInfo
+    alertRuleInfo: alertRuleInfo,deleteButton
   },
   props: {
     nowTime: {
diff --git a/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue b/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue
index ab6c36ad3..b91054371 100644
--- a/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue
+++ b/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue
@@ -149,7 +149,23 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-if="!scope.row.buildIn" v-has="'alertRule_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
-            <el-dropdown-item v-if="!scope.row.buildIn" v-has="'alertRule_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-if="!scope.row.buildIn" v-has="'alertRule_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-if="!scope.row.buildIn" v-has="'alertRule_delete'" :command="['delete', scope.row]">
+            <delete-button
+                  ref="deleteButton"
+                  :from="'alertRule'"
+                  :forceDeleteShow="false"
+                  :deleteTitle="'alert.alertRule'"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="alert-rule-delete"
+                  v-has="'alertRule_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+            </el-dropdown-item>
             <el-dropdown-item v-if="!scope.row.buildIn" v-has="'alertRule_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'alertSilence_add'" :command="['fastSilence', scope.row, 'alertRule']"><i class="nz-icon nz-icon-fast-silence"></i><span class="operation-dropdown-text">{{$t('overall.silenceAlert')}}</span></el-dropdown-item>
           </el-dropdown-menu>
@@ -170,9 +186,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 import chartDataFormat from '@/components/chart/chartDataFormat'
 export default {
   name: 'alertRuleTable',
+  components: { deleteButton },
   mixins: [table],
   props: {
     loading: Boolean
diff --git a/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue b/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue
index 238b7d085..6133d380f 100644
--- a/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue
+++ b/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue
@@ -155,14 +155,30 @@
                 $t("overall.duplicate")
               }}</span></el-dropdown-item
             >
-            <el-dropdown-item
+            <!-- <el-dropdown-item
               v-has="'alertSilence_expire'"
               :command="['delete', scope.row]"
               ><i class="nz-icon nz-icon-delete"></i
               ><span class="operation-dropdown-text">{{
                 $t("overall.delete")
               }}</span></el-dropdown-item
-            >
+            > -->
+             <el-dropdown-item v-has="'alertSilence_expire'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'alertSilence'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :deleteTitle="'overall.silence'"
+                  :title="$t('overall.delete')"
+                  id="role-list-delete"
+                  v-has="'alertSilence_expire'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -184,10 +200,12 @@ import table from '@/components/common/mixin/table'
 import { calcDurationByStringTimeB } from '@/components/common/js/tools'
 import nzAlertTag from '../../../page/alert/nzAlertTag'
 import { sameLabels } from '@/components/common/js/constants'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'alertSilenceTable',
   components: {
-    nzAlertTag
+    nzAlertTag,
+    deleteButton
   },
   mixins: [table],
   props: {
diff --git a/nezha-fronted/src/components/common/table/asset/assetMetaTable.vue b/nezha-fronted/src/components/common/table/asset/assetMetaTable.vue
index 92e55acd3..e12dbdbf3 100644
--- a/nezha-fronted/src/components/common/table/asset/assetMetaTable.vue
+++ b/nezha-fronted/src/components/common/table/asset/assetMetaTable.vue
@@ -92,7 +92,22 @@
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
 <!--            <el-dropdown-item v-has="'asset_label_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>-->
             <el-dropdown-item v-has="'asset_label_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'asset_label_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'asset_label_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+             <el-dropdown-item v-has="'asset_label_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'assetMeta'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="asset-meta-delete"
+                  v-has="'asset_label_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -111,9 +126,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'assetLabelTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/asset/assetTable.vue b/nezha-fronted/src/components/common/table/asset/assetTable.vue
index 36226d4bc..7843f7b2b 100644
--- a/nezha-fronted/src/components/common/table/asset/assetTable.vue
+++ b/nezha-fronted/src/components/common/table/asset/assetTable.vue
@@ -163,7 +163,23 @@
               <el-dropdown-item v-if="!assetTab" v-has="'asset_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
               <el-dropdown-item v-has="'asset_connect'" :command="['cli', scope.row]" :disabled="!scope.row.authUsername"><i class="nz-icon nz-icon-cli"></i><span class="operation-dropdown-text">{{$t('config.system.terminal.terminal')}}</span></el-dropdown-item>
               <el-dropdown-item v-has="'asset_add'" :command="['duplicate', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-              <el-dropdown-item v-has="'asset_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+              <el-dropdown-item v-has="'asset_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'asset'"
+                  :forceDeleteShow="true"
+                  :deleteTitle="'overall.asset'"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="asset-list-delete"
+                  v-has="'asset_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
+              <!-- <el-dropdown-item v-has="'asset_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
               <el-dropdown-item v-has="'alertSilence_add'" :command="['fastSilence', scope.row, 'asset']"><i class="nz-icon nz-icon-fast-silence"></i><span class="operation-dropdown-text">{{$t('overall.silenceAlert')}}</span></el-dropdown-item>
               <el-dropdown-item v-has="'asset_add'" :command="['topology', scope.row, 'asset']"><i class="nz-icon nz-icon-Topology"></i><span class="operation-dropdown-text">{{$t('overall.topology')}}</span></el-dropdown-item>
             </el-dropdown-menu>
@@ -194,6 +210,7 @@
 import table from '@/components/common/mixin/table'
 import { showTableTooltip, hideTableTooltip } from '@/components/common/js/tools'
 // import bus from '@/libs/bus'
+import deleteButton from '@/components/common/deleteButton'
 import copy from '@/components/common/copy'
 import alertLabel from '@/components/common/alert/alertLabel'
 import alertDaysInfo from '@/components/common/alert/alertDaysInfo'
@@ -204,7 +221,8 @@ export default {
   components: {
     alertLabel: alertLabel,
     alertDaysInfo,
-    copy
+    copy,
+    deleteButton
   },
   props: {
     showOption: {
diff --git a/nezha-fronted/src/components/common/table/settings/agentTable.vue b/nezha-fronted/src/components/common/table/settings/agentTable.vue
index b20044a36..a17d890c2 100644
--- a/nezha-fronted/src/components/common/table/settings/agentTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/agentTable.vue
@@ -83,7 +83,22 @@
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'agent_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'agent_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'agent_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'agent_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'agent_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'agent'"
+                  :forceDeleteShow="true"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="promserver-list-delete"
+                  v-has="'agent_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -112,6 +127,7 @@ import bus from '@/libs/bus'
 import table from '@/components/common/mixin/table'
 import { agent } from '@/components/common/js/constants'
 import alertStateInfo from '@/components/common/alert/alertStateInfo'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'agentTable',
   props: {
@@ -119,7 +135,7 @@ export default {
   },
   mixins: [table],
   components: {
-    alertStateInfo
+    alertStateInfo, deleteButton
   },
   data () {
     return {
diff --git a/nezha-fronted/src/components/common/table/settings/assetTypeTable.vue b/nezha-fronted/src/components/common/table/settings/assetTypeTable.vue
index e553bf632..cadf3c3e9 100644
--- a/nezha-fronted/src/components/common/table/settings/assetTypeTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/assetTypeTable.vue
@@ -78,7 +78,20 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'assetType_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'assetType_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'assetType_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'assetType_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'assetType'"
+                  :forceDeleteShow="false"
+                  id="account-list-delete"
+                  v-has="'user_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -97,11 +110,13 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'asstTypeTable',
   props: {
     loading: Boolean
   },
+  components: { deleteButton },
   mixins: [table],
   data () {
     return {
diff --git a/nezha-fronted/src/components/common/table/settings/backupsTable.vue b/nezha-fronted/src/components/common/table/settings/backupsTable.vue
index f4fb68662..ce8c237e0 100644
--- a/nezha-fronted/src/components/common/table/settings/backupsTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/backupsTable.vue
@@ -54,9 +54,22 @@
         <button class="table-operation-button" @click="Restore(scope.row)" v-if="scope.row" :title="$t('backup.RestoreNow')">
          <i class="nz-icon-shujubeifenhuifu nz-icon"></i>
         </button>
-        <button class="table-operation-edit" @click="del(scope.row)" v-if="scope.row" :title="$t('overall.delete')">
+        <div v-if="scope.row" @click="tableOperation(scope.row)">
+           <delete-button
+            ref="deleteButton"
+            :forceDeleteShow="false"
+            id="backup-delete"
+            :from="'backup'"
+            :type="'btn'"
+            :api="'/sys/backup'"
+            :single="true"
+            :delete-objs="singleDelete"
+            @before="delFlag=true"
+            ></delete-button>
+          </div>
+        <!-- <button class="table-operation-edit" @click="del(scope.row)" v-if="scope.row" :title="$t('overall.delete')">
           <i class="nz-icon nz-icon-delete" style="font-size='12px'"></i>
-        </button>
+        </button> -->
       </div>
     </el-table-column>
      <template slot="empty">
@@ -76,11 +89,12 @@
 import { post, put } from '@/http'
 import lodash from 'lodash'
 import bus from '@/libs/bus'
+import deleteButton from '@/components/common/deleteButton'
 
 export default {
   name: 'backupsTable',
   mixins: [],
-
+  components: { deleteButton },
   props: {
     loading: Boolean,
     customTableTitle: Array,
@@ -90,6 +104,7 @@ export default {
   },
   data () {
     return {
+      singleDelete: []
       // tableData: [
       //   {
       //     retention: '',
@@ -111,9 +126,6 @@ export default {
       // ]
     }
   },
-
-  components: {},
-
   computed: {},
 
   methods: {
@@ -145,15 +157,15 @@ export default {
         }, 400)
       }
     },
-    del (row) {
-      this.$delete('/sys/backup?filename=' + row.fileName).then(res => {
-        if (res.code == 200) {
-          this.$emit('getTableData', 'recent')
-        } else {
-          this.$message.error(res.msg)
-        }
-      })
-    },
+    // del (row) {
+    //   this.$delete('/sys/backup?filename=' + row.fileName).then(res => {
+    //     if (res.code == 200) {
+    //       this.$emit('getTableData', 'recent')
+    //     } else {
+    //       this.$message.error(res.msg)
+    //     }
+    //   })
+    // },
     changeDate (item) {
       const time = this.utcTimeToTimezoneStr(item)
       const time1 = this.timeFormate(time)
@@ -174,6 +186,16 @@ export default {
     },
     edit () {
       this.$emit('edit', this.tableData[0])
+    },
+    tableOperation (row) {
+      this.$set(row, 'name', row.fileName)
+      if (this.singleDelete.length === 0) {
+        this.singleDelete.push(row)
+      } else {
+        this.singleDelete = []
+        this.singleDelete.push(row)
+      }
+      console.log(this.singleDelete)
     }
   },
 
diff --git a/nezha-fronted/src/components/common/table/settings/cabinetTable.vue b/nezha-fronted/src/components/common/table/settings/cabinetTable.vue
index a46bdac57..9d99ae906 100644
--- a/nezha-fronted/src/components/common/table/settings/cabinetTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/cabinetTable.vue
@@ -39,7 +39,21 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'dc_add'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item :command="['delete', scope.row]" v-has="'dc_delete'"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item :command="['delete', scope.row]" v-has="'dc_delete'"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item :command="['delete', scope.row]" v-has="'dc_delete'">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'cabinet'"
+                  :forceDeleteShow="false"
+                  id="cabinet-delete"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -60,9 +74,10 @@
 import table from '@/components/common/mixin/table'
 import Template from '../../../page/config/template'
 import alertDaysInfo from '@/components/common/alert/alertDaysInfo'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'cabinetTable',
-  components: { Template, alertDaysInfo },
+  components: { Template, alertDaysInfo, deleteButton },
   mixins: [table],
   props: {
     loading: Boolean
diff --git a/nezha-fronted/src/components/common/table/settings/chartTmplTable.vue b/nezha-fronted/src/components/common/table/settings/chartTmplTable.vue
index 8c7c99589..96782229a 100644
--- a/nezha-fronted/src/components/common/table/settings/chartTmplTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/chartTmplTable.vue
@@ -64,7 +64,22 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'chartTemplate_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'chartTemplate_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'chartTemplate_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'chartTemplate_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'chartTemp'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="alert-msg-delete"
+                  v-has="'expressionTemplate_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
             <el-dropdown-item v-has="'chartTemplate_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'chartTemplate_edit'" :command="['sync', scope.row]"><i class="nz-icon nz-icon-sync"></i><span class="operation-dropdown-text">{{$t('overall.syncChart')}}</span></el-dropdown-item>
           </el-dropdown-menu>
@@ -86,9 +101,11 @@
 <script>
 import table from '@/components/common/mixin/table'
 import { chart as chartConstant } from '@/components/common/js/constants'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'chartTmplTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/credentialsTable.vue b/nezha-fronted/src/components/common/table/settings/credentialsTable.vue
index b01188056..2fb25f88c 100644
--- a/nezha-fronted/src/components/common/table/settings/credentialsTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/credentialsTable.vue
@@ -79,7 +79,22 @@
             <i class="nz-icon nz-icon-more3"></i>
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
-            <el-dropdown-item v-has="'credential_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'credential_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'credential_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'credentials'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="mib-list-delete"
+                  v-has="'credential_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -98,11 +113,13 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'credentialsTable',
   props: {
     loading: Boolean
   },
+  components: { deleteButton },
   mixins: [table],
   data () {
     return {
diff --git a/nezha-fronted/src/components/common/table/settings/dcTable.vue b/nezha-fronted/src/components/common/table/settings/dcTable.vue
index 2e1d44181..2d00731c6 100644
--- a/nezha-fronted/src/components/common/table/settings/dcTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/dcTable.vue
@@ -112,7 +112,23 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'dc_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'dc_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'dc_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'dc_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'datacenter'"
+                  :forceDeleteShow="true"
+                  :deleteTitle="'overall.dc'"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="account-list-delete"
+                  v-has="'dc_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
             <el-dropdown-item v-has="'asset_add'" :command="['topology', scope.row, 'datacenter']"><i class="nz-icon nz-icon-Topology"></i><span class="operation-dropdown-text">{{$t('overall.topology')}}</span></el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
@@ -134,11 +150,12 @@
 import table from '@/components/common/mixin/table'
 import { showTableTooltip, hideTableTooltip } from '@/components/common/js/tools'
 import alertDaysInfo from '@/components/common/alert/alertDaysInfo'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'dcTable',
   mixins: [table],
   components: {
-    alertDaysInfo
+    alertDaysInfo, deleteButton
   },
   props: {
     loading: Boolean
diff --git a/nezha-fronted/src/components/common/table/settings/endpointTable.vue b/nezha-fronted/src/components/common/table/settings/endpointTable.vue
index edf804520..897d1cf6e 100644
--- a/nezha-fronted/src/components/common/table/settings/endpointTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/endpointTable.vue
@@ -176,7 +176,23 @@
             <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
               <!--            <el-dropdown-item v-if="!endpointTab" :command="['endpointQuery', scope.row]"><i class="nz-icon nz-icon-search"></i><span class="operation-dropdown-text">{{$t('overall.query')}}</span></el-dropdown-item>-->
               <el-dropdown-item v-if="!endpointTab" v-has="'monitor_endpoint_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
-              <el-dropdown-item v-has="'monitor_endpoint_delete'" :command="['delete', scope.row, `sys/endpoint?ids=${scope.row.id}`]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+              <!-- <el-dropdown-item v-has="'monitor_endpoint_delete'" :command="['delete', scope.row, `sys/endpoint?ids=${scope.row.id}`]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+              <el-dropdown-item v-has="'monitor_endpoint_delete'" :command="['delete', scope.row, `sys/endpoint?ids=${scope.row.id}`]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'endpoint'"
+                  :forceDeleteShow="false"
+                  :deleteTitle="'project.endpoint.endpoint'"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="account-list-delete"
+                  v-has="'monitor_endpoint_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
               <el-dropdown-item v-has="'monitor_endpoint_edit'" :command="['copy', scope.row, 'project']"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
               <el-dropdown-item v-has="'alertSilence_add'" :command="['fastSilence', scope.row, 'endpoint']"><i class="nz-icon nz-icon-fast-silence"></i><span class="operation-dropdown-text">{{$t('overall.silenceAlert')}}</span></el-dropdown-item>
               <el-dropdown-item v-has="'asset_add'" :command="['topology', scope.row, 'endpoint']"><i class="nz-icon nz-icon-Topology"></i><span class="operation-dropdown-text">{{$t('overall.topology')}}</span></el-dropdown-item>
@@ -208,11 +224,13 @@ import table from '@/components/common/mixin/table'
 import alertLabel from '../../alert/alertLabel'
 import nzTooltip from '../../alert/nzTooltip'
 import alertLabelMixin from '@/components/common/mixin/alertLabelMixin'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'endpointTable',
   components: {
     alertLabel,
-    nzTooltip
+    nzTooltip,
+    deleteButton
   },
   mixins: [table, alertLabelMixin],
   props: {
diff --git a/nezha-fronted/src/components/common/table/settings/exprTmplTable.vue b/nezha-fronted/src/components/common/table/settings/exprTmplTable.vue
index 549b8c40e..8f6b1d3e8 100644
--- a/nezha-fronted/src/components/common/table/settings/exprTmplTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/exprTmplTable.vue
@@ -64,7 +64,22 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'expressionTemplate_add'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'expressionTemplate_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'expressionTemplate_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'expressionTemplate_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'exprTemp'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="alert-msg-delete"
+                  v-has="'expressionTemplate_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -83,9 +98,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'exprTmplTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/globalizationTable.vue b/nezha-fronted/src/components/common/table/settings/globalizationTable.vue
index 7d9d9e002..50e542411 100644
--- a/nezha-fronted/src/components/common/table/settings/globalizationTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/globalizationTable.vue
@@ -55,7 +55,21 @@
             <i class="nz-icon nz-icon-more3"></i>
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
-            <el-dropdown-item v-has="'i18n_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'i18n_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'i18n_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'globalization'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="globalization-delete"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -74,9 +88,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'globalizationTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/ipDetailsTable.vue b/nezha-fronted/src/components/common/table/settings/ipDetailsTable.vue
index b4a5e8eae..2d0523a51 100644
--- a/nezha-fronted/src/components/common/table/settings/ipDetailsTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/ipDetailsTable.vue
@@ -65,7 +65,19 @@
             <i class="nz-icon nz-icon-more3"></i>
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
-            <el-dropdown-item v-has="'ipam_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'ipam_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'ipam_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'ipDetails'"
+                  :forceDeleteShow="false"
+                  id="account-list-delete"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -84,9 +96,13 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'ipDetailsTable',
   mixins: [table],
+  components:{
+    deleteButton
+  },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/ipamTable.vue b/nezha-fronted/src/components/common/table/settings/ipamTable.vue
index 4565343ae..6a3d2abf9 100644
--- a/nezha-fronted/src/components/common/table/settings/ipamTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/ipamTable.vue
@@ -69,7 +69,22 @@
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'ipam_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'ipam_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'ipam_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'ipam_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'ipam_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'ipam'"
+                  :forceDeleteShow="true"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="account-list-delete"
+                  v-has="'ipam_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
             <!-- <el-dropdown-item v-has="'ipam_edit'" :command="['sync', scope.row]"><i class="nz-icon nz-icon-sync"></i><span class="operation-dropdown-text">{{$t('overall.syncChart')}}</span></el-dropdown-item> -->
           </el-dropdown-menu>
         </el-dropdown>
@@ -89,9 +104,13 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'ipamTable',
   mixins: [table],
+  components: {
+    deleteButton
+  },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/issueTable.vue b/nezha-fronted/src/components/common/table/settings/issueTable.vue
index 4e1aa6859..ae461e215 100644
--- a/nezha-fronted/src/components/common/table/settings/issueTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/issueTable.vue
@@ -103,7 +103,19 @@
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'issue'"
+                  :forceDeleteShow="false"
+                  id="issue-delete"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -123,11 +135,13 @@
 <script>
 import table from '@/components/common/mixin/table'
 import copy from '@/components/common/copy'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'issueTable',
   mixins: [table],
   components: {
-    copy
+    copy,
+    deleteButton
   },
 
   props: {
diff --git a/nezha-fronted/src/components/common/table/settings/menuTable.vue b/nezha-fronted/src/components/common/table/settings/menuTable.vue
index abcbb66ad..aa412f1ec 100644
--- a/nezha-fronted/src/components/common/table/settings/menuTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/menuTable.vue
@@ -67,7 +67,19 @@
             <i class="nz-icon nz-icon-more3"></i>
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
-            <el-dropdown-item  v-has="'monitor_module_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item  v-has="'monitor_module_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'monitor_module_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'menus'"
+                  :forceDeleteShow="false"
+                  id="menus-list-delete"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -86,9 +98,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'menuTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/mibTable.vue b/nezha-fronted/src/components/common/table/settings/mibTable.vue
index 64ca14765..6acc475ae 100644
--- a/nezha-fronted/src/components/common/table/settings/mibTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/mibTable.vue
@@ -94,7 +94,22 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'snmp_mibFile_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'snmp_mibFile_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'snmp_mibFile_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'snmp_mibFile_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'mib'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="mib-list-delete"
+                  v-has="'snmp_mibFile_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -113,10 +128,12 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 import axios from 'axios'
 export default {
   name: 'mibTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/modelTable.vue b/nezha-fronted/src/components/common/table/settings/modelTable.vue
index b3cc4597b..6d1edbaea 100644
--- a/nezha-fronted/src/components/common/table/settings/modelTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/modelTable.vue
@@ -86,7 +86,22 @@
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
 <!--            <el-dropdown-item :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>-->
             <el-dropdown-item v-has="'model_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'model_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'model_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'model_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'model'"
+                  :forceDeleteShow="true"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="account-list-delete"
+                  v-has="'model_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
             <el-dropdown-item v-has="'main_edit'" :command="['sync', scope.row]"><i class="nz-icon nz-icon-sync"></i><span class="operation-dropdown-text">{{$t('overall.syncChart')}}</span></el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
@@ -106,9 +121,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'modelTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/moduleTable.vue b/nezha-fronted/src/components/common/table/settings/moduleTable.vue
index ea2a6d971..8abed4f11 100644
--- a/nezha-fronted/src/components/common/table/settings/moduleTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/moduleTable.vue
@@ -91,7 +91,23 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'monitor_module_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'monitor_module_delete'" :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'monitor_module_delete'" :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'monitor_module_delete'" :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'module'"
+                  :forceDeleteShow="true"
+                  :type="'link'"
+                  :deleteTitle="'project.module.module'"
+                  :title="$t('overall.delete')"
+                  id="account-list-delete"
+                  v-has="'monitor_module_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
             <el-dropdown-item v-has="'monitor_module_edit'" :command="['copy', scope.row, 'module']"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'main_edit'" :command="['sync', scope.row]"><i class="nz-icon nz-icon-sync"></i><span class="operation-dropdown-text">{{$t('overall.syncChart')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'alertSilence_add'" :command="['fastSilence', scope.row, 'module']"><i class="nz-icon nz-icon-fast-silence"></i><span class="operation-dropdown-text">{{$t('overall.silenceAlert')}}</span></el-dropdown-item>
@@ -114,9 +130,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'moduleTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/projectTable.vue b/nezha-fronted/src/components/common/table/settings/projectTable.vue
index bc2cfa727..102d189a2 100644
--- a/nezha-fronted/src/components/common/table/settings/projectTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/projectTable.vue
@@ -89,7 +89,23 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item :command="['edit', scope.row]" v-has="'project_edit'"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
-            <el-dropdown-item :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]" v-has="'project_delete'"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]" v-has="'project_delete'"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]" v-has="'project_delete'">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'project'"
+                  :forceDeleteShow="true"
+                  :type="'link'"
+                  :deleteTitle="'overall.project'"
+                  :title="$t('overall.delete')"
+                  id="account-list-delete"
+                  v-has="'project_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
             <el-dropdown-item v-has="'project_edit'" :command="['copy', scope.row, 'project']"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'alertSilence_add'" :command="['fastSilence', scope.row, 'project']"><i class="nz-icon nz-icon-fast-silence"></i><span class="operation-dropdown-text">{{$t('overall.silenceAlert')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'asset_add'" :command="['topology', scope.row, 'project']"><i class="nz-icon nz-icon-Topology"></i><span class="operation-dropdown-text">{{$t('overall.topology')}}</span></el-dropdown-item>
@@ -111,9 +127,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'projectTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/recordRuleTable.vue b/nezha-fronted/src/components/common/table/settings/recordRuleTable.vue
index 995dc5073..3c3a4e3b2 100644
--- a/nezha-fronted/src/components/common/table/settings/recordRuleTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/recordRuleTable.vue
@@ -116,7 +116,21 @@
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-if="!scope.row.buildIn" v-has="'record_rule_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'recordRule'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="record-rule-delete"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -138,11 +152,13 @@ import lodash from 'lodash'
 import copy from '@/components/common/copy'
 import table from '@/components/common/mixin/table'
 import nzAlertTag from '../../../page/alert/nzAlertTag'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'recordRuleTable',
   components: {
     nzAlertTag,
-    copy
+    copy,
+    deleteButton
   },
   mixins: [table],
   props: {
diff --git a/nezha-fronted/src/components/common/table/settings/roleTable.vue b/nezha-fronted/src/components/common/table/settings/roleTable.vue
index d90afe51f..6bdc78f85 100644
--- a/nezha-fronted/src/components/common/table/settings/roleTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/roleTable.vue
@@ -66,7 +66,23 @@
           </div>
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'role_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'role_delete'" :command="['delete', scope.row]" :disabled="isBuiltIn(scope.row)"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'role_delete'" :command="['delete', scope.row]" :disabled="isBuiltIn(scope.row)"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'role_delete'" :command="['delete', scope.row]" :disabled="isBuiltIn(scope.row)">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'roles'"
+                  :forceDeleteShow="true"
+                  :deleteTitle="'config.roles.roles'"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="role-list-batch-delete"
+                  v-has="'role_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -85,9 +101,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'roleTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/common/table/settings/userTable.vue b/nezha-fronted/src/components/common/table/settings/userTable.vue
index 4500b1fc6..7b9315af4 100644
--- a/nezha-fronted/src/components/common/table/settings/userTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/userTable.vue
@@ -102,7 +102,23 @@
           <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
             <el-dropdown-item v-has="'user_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'user_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
-            <el-dropdown-item v-has="'user_delete'" :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <!-- <el-dropdown-item v-has="'user_delete'" :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+            <el-dropdown-item v-has="'user_delete'" :command="['delete', scope.row]" :disabled="scope.row.id === 1">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'user'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :deleteTitle="'config.user.user'"
+                  :title="$t('overall.delete')"
+                  id="account-list-batch-delete"
+                  v-has="'user_delete'"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
             <el-dropdown-item v-has="'user_edit'" :command="['reset_mfa', scope.row]"><i class="nz-icon nz-icon-zhongzhi2FA"></i><span class="operation-dropdown-text">{{$t('config.user.resetMfa')}}</span></el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
@@ -123,9 +139,11 @@
 
 <script>
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'userTable',
   mixins: [table],
+  components: { deleteButton },
   props: {
     loading: Boolean
   },
diff --git a/nezha-fronted/src/components/page/alert/alertMessage.vue b/nezha-fronted/src/components/page/alert/alertMessage.vue
index c744864a8..2c6a89da4 100644
--- a/nezha-fronted/src/components/page/alert/alertMessage.vue
+++ b/nezha-fronted/src/components/page/alert/alertMessage.vue
@@ -37,6 +37,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'alertMessage'"
                   :forceDeleteShow="false"
                   :deleteTitle="'alert.alertMessage'"
diff --git a/nezha-fronted/src/components/page/alert/alertRule.vue b/nezha-fronted/src/components/page/alert/alertRule.vue
index b28c17b63..63f4618c3 100644
--- a/nezha-fronted/src/components/page/alert/alertRule.vue
+++ b/nezha-fronted/src/components/page/alert/alertRule.vue
@@ -101,6 +101,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'alertRule'"
                   :forceDeleteShow="false"
                   :deleteTitle="'alert.alertRule'"
diff --git a/nezha-fronted/src/components/page/alert/alertSilence.vue b/nezha-fronted/src/components/page/alert/alertSilence.vue
index 479933bcb..40ead6577 100644
--- a/nezha-fronted/src/components/page/alert/alertSilence.vue
+++ b/nezha-fronted/src/components/page/alert/alertSilence.vue
@@ -22,6 +22,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'alertSilence'"
           :forceDeleteShow="false"
           :deleteTitle="'overall.silence'"
diff --git a/nezha-fronted/src/components/page/asset/asset.vue b/nezha-fronted/src/components/page/asset/asset.vue
index a35d444f2..e46aeb667 100644
--- a/nezha-fronted/src/components/page/asset/asset.vue
+++ b/nezha-fronted/src/components/page/asset/asset.vue
@@ -117,6 +117,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'asset'"
                   :forceDeleteShow="true"
                   :deleteTitle="'overall.asset'"
diff --git a/nezha-fronted/src/components/page/config/agent.vue b/nezha-fronted/src/components/page/config/agent.vue
index 7fc302f11..5f4f81d08 100644
--- a/nezha-fronted/src/components/page/config/agent.vue
+++ b/nezha-fronted/src/components/page/config/agent.vue
@@ -19,6 +19,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'agent'"
           :forceDeleteShow="true"
           id="promserver-list-batch-delete"
diff --git a/nezha-fronted/src/components/page/config/assetMeta.vue b/nezha-fronted/src/components/page/config/assetMeta.vue
index a22a3b11e..544b71d57 100644
--- a/nezha-fronted/src/components/page/config/assetMeta.vue
+++ b/nezha-fronted/src/components/page/config/assetMeta.vue
@@ -36,6 +36,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'assetMeta'"
           :forceDeleteShow="false"
           :delete-objs="batchDeleteObjs"
diff --git a/nezha-fronted/src/components/page/config/assetState.vue b/nezha-fronted/src/components/page/config/assetState.vue
index 6175832dd..e35ee4703 100644
--- a/nezha-fronted/src/components/page/config/assetState.vue
+++ b/nezha-fronted/src/components/page/config/assetState.vue
@@ -17,6 +17,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'assetState'"
           :forceDeleteShow="false"
           id="asset-state-list-batch-delete"
diff --git a/nezha-fronted/src/components/page/config/assetType.vue b/nezha-fronted/src/components/page/config/assetType.vue
index c5552ff69..5cb584a1c 100644
--- a/nezha-fronted/src/components/page/config/assetType.vue
+++ b/nezha-fronted/src/components/page/config/assetType.vue
@@ -16,6 +16,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'assetType'"
           :forceDeleteShow="false"
           id="account-list-batch-delete"
diff --git a/nezha-fronted/src/components/page/config/backups.vue b/nezha-fronted/src/components/page/config/backups.vue
index 02ff0f858..d5206f3ee 100644
--- a/nezha-fronted/src/components/page/config/backups.vue
+++ b/nezha-fronted/src/components/page/config/backups.vue
@@ -98,7 +98,11 @@ export default {
       isRefresh: ''
     }
   },
-
+  provide () {
+    return {
+      getTableData: this.getTableData
+    }
+  },
   components: { nzDataList, backupsTable, backupsBox },
 
   computed: {},
diff --git a/nezha-fronted/src/components/page/config/credentials.vue b/nezha-fronted/src/components/page/config/credentials.vue
index ad0b1485f..8dae4a0a9 100644
--- a/nezha-fronted/src/components/page/config/credentials.vue
+++ b/nezha-fronted/src/components/page/config/credentials.vue
@@ -15,6 +15,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'credentials'"
           :forceDeleteShow="false"
           id="mib-list-batch-delete"
diff --git a/nezha-fronted/src/components/page/config/dc.vue b/nezha-fronted/src/components/page/config/dc.vue
index 10281fd68..c73fde544 100644
--- a/nezha-fronted/src/components/page/config/dc.vue
+++ b/nezha-fronted/src/components/page/config/dc.vue
@@ -107,6 +107,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'datacenter'"
                   :forceDeleteShow="true"
                   :deleteTitle="'overall.dc'"
diff --git a/nezha-fronted/src/components/page/config/ipam.vue b/nezha-fronted/src/components/page/config/ipam.vue
index 5f134a087..14867d500 100644
--- a/nezha-fronted/src/components/page/config/ipam.vue
+++ b/nezha-fronted/src/components/page/config/ipam.vue
@@ -33,6 +33,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'ipam'"
                   :forceDeleteShow="true"
                   :type="'link'"
diff --git a/nezha-fronted/src/components/page/config/menus.vue b/nezha-fronted/src/components/page/config/menus.vue
index 5426b34b0..19f505bfd 100644
--- a/nezha-fronted/src/components/page/config/menus.vue
+++ b/nezha-fronted/src/components/page/config/menus.vue
@@ -14,6 +14,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'menus'"
           :forceDeleteShow="false"
           id="menus-list-batch-delete"
diff --git a/nezha-fronted/src/components/page/config/mib.vue b/nezha-fronted/src/components/page/config/mib.vue
index 052b486f2..122d3864c 100644
--- a/nezha-fronted/src/components/page/config/mib.vue
+++ b/nezha-fronted/src/components/page/config/mib.vue
@@ -15,6 +15,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'mib'"
           :forceDeleteShow="false"
           id="mib-list-batch-delete"
diff --git a/nezha-fronted/src/components/page/config/model.vue b/nezha-fronted/src/components/page/config/model.vue
index 2de76ce92..fdf205c2a 100644
--- a/nezha-fronted/src/components/page/config/model.vue
+++ b/nezha-fronted/src/components/page/config/model.vue
@@ -33,6 +33,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'model'"
                   :forceDeleteShow="true"
                   :type="'link'"
diff --git a/nezha-fronted/src/components/page/config/roles.vue b/nezha-fronted/src/components/page/config/roles.vue
index 770fd494a..bcba26ade 100644
--- a/nezha-fronted/src/components/page/config/roles.vue
+++ b/nezha-fronted/src/components/page/config/roles.vue
@@ -16,6 +16,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'roles'"
           :forceDeleteShow="true"
           :deleteTitle="'config.roles.roles'"
diff --git a/nezha-fronted/src/components/page/config/system/apiKeyTable.vue b/nezha-fronted/src/components/page/config/system/apiKeyTable.vue
index 11fc4d4b4..8ab496e0c 100644
--- a/nezha-fronted/src/components/page/config/system/apiKeyTable.vue
+++ b/nezha-fronted/src/components/page/config/system/apiKeyTable.vue
@@ -105,7 +105,20 @@
             <button :disabled="prevent_opt.save" class="nz-btn nz-btn-size-mini nz-btn-style-light" type="button" @click="cancel(scope.row)"><span>{{$t('overall.cancel')}}</span></button>
           </template>
           <template v-else>
-            <button class="table-operation-item" @click="$emit('del',scope.row)" v-has="'system_apiKey_delete'" :title="$t('overall.delete')"><i class="nz-icon nz-icon-delete"></i></button>
+           <!-- <button class="table-operation-item" @click="$emit('del',scope.row)" v-has="'system_apiKey_delete'" :title="$t('overall.delete')"><i class="nz-icon nz-icon-delete"></i></button> -->
+            <div @click="tableOperation(scope.row)" v-has="'system_apiKey_delete'">
+              <delete-button
+              ref="deleteButton"
+              :forceDeleteShow="false"
+              id="apiKey-delete"
+              :from="'apiKey'"
+              :type="'btn'"
+              :api="api"
+              :single="true"
+              :delete-objs="singleDelete"
+               @before="delFlag=true"
+              ></delete-button>
+            </div>
           </template>
         </div>
       </el-table-column>
@@ -124,11 +137,13 @@
 <script>
 import { tableCommon } from './systemCommon'
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'apiKeyTable',
   props: {
     loading: Boolean
   },
+  components: { deleteButton },
   mixins: [table, tableCommon],
   data () {
     return {
@@ -179,7 +194,7 @@ export default {
           return time.getTime() < Date.now() - 24 * 60 * 60 * 1000
         }
       },
-      reg: new RegExp("(?<=.{8}).", 'g')
+      reg: new RegExp('(?<=.{8}).', 'g')
     }
   },
   methods: {
@@ -215,6 +230,14 @@ export default {
       }
       delete copy.role
       this.saveOrUpdate(copy)
+    },
+    tableOperation (row) {
+      if (this.singleDelete.length === 0) {
+        this.singleDelete.push(row)
+      } else {
+        this.singleDelete = []
+        this.singleDelete.push(row)
+      }
     }
   },
   mounted () {
diff --git a/nezha-fronted/src/components/page/config/system/linkTable.vue b/nezha-fronted/src/components/page/config/system/linkTable.vue
index 3292e0cbe..caaf6f172 100644
--- a/nezha-fronted/src/components/page/config/system/linkTable.vue
+++ b/nezha-fronted/src/components/page/config/system/linkTable.vue
@@ -71,7 +71,21 @@
                 <i class="nz-icon nz-icon-more3"></i>
               </div>
               <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
-                <el-dropdown-item v-has="'system_link_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+                <!-- <el-dropdown-item v-has="'system_link_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+                <el-dropdown-item v-has="'system_link_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'link'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="link-delete"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </template>
@@ -93,11 +107,13 @@
 import { tableCommon } from './systemCommon'
 import bus from '../../../../libs/bus'
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'linkTable',
   props: {
     loading: Boolean
   },
+  components: { deleteButton },
   mixins: [table, tableCommon],
   data () {
     return {
diff --git a/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue b/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue
index 7a6aed9f3..7a9f88915 100644
--- a/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue
+++ b/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue
@@ -81,7 +81,21 @@
                 <i class="nz-icon nz-icon-more3"></i>
               </div>
               <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
-                <el-dropdown-item v-has="'system_notification_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+                <!-- <el-dropdown-item v-has="'system_notification_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item> -->
+                <el-dropdown-item v-has="'system_notification_delete'" :command="['delete', scope.row]">
+                  <delete-button
+                  ref="deleteButton"
+                  :from="'notifyMethod'"
+                  :forceDeleteShow="false"
+                  :type="'link'"
+                  :title="$t('overall.delete')"
+                  id="notify-method-delete"
+                  :api="api"
+                  :single="true"
+                  :delete-objs="singleDelete"
+                  @before="delFlag=true"
+                  ></delete-button>
+              </el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </template>
@@ -102,11 +116,13 @@
 <script>
 import table from '@/components/common/mixin/table'
 import { tableCommon } from './systemCommon'
+import deleteButton from '@/components/common/deleteButton'
 export default {
   name: 'notifyMethodTable',
   props: {
     loading: Boolean
   },
+  components: { deleteButton },
   mixins: [table, tableCommon],
   data () {
     return {
diff --git a/nezha-fronted/src/components/page/config/system/selfApiKeyTab.vue b/nezha-fronted/src/components/page/config/system/selfApiKeyTab.vue
index b9c200c92..871461c03 100644
--- a/nezha-fronted/src/components/page/config/system/selfApiKeyTab.vue
+++ b/nezha-fronted/src/components/page/config/system/selfApiKeyTab.vue
@@ -51,7 +51,7 @@ import { parentTableCommon } from './systemCommon'
 import bus from '@/libs/bus'
 
 export default {
-  name: 'apiKeyTab',
+  name: 'selfApiKeyTab',
   components: { nzDataList, selfApiKeyTable },
   mixins: [dataListMixin, parentTableCommon],
   props: {
diff --git a/nezha-fronted/src/components/page/config/system/selfApiKeyTable.vue b/nezha-fronted/src/components/page/config/system/selfApiKeyTable.vue
index 99d0476c4..0cc691dee 100644
--- a/nezha-fronted/src/components/page/config/system/selfApiKeyTable.vue
+++ b/nezha-fronted/src/components/page/config/system/selfApiKeyTable.vue
@@ -67,7 +67,20 @@
             <button :disabled="prevent_opt.save" class="nz-btn nz-btn-size-mini nz-btn-style-light" type="button" @click="cancel(scope.row)"><span>{{$t('overall.cancel')}}</span></button>
           </template>
           <template v-else>
-            <button class="table-operation-item" @click="$emit('del',scope.row)" v-has="'system_apiKey_delete'"><i class="nz-icon nz-icon-delete"></i></button>
+            <!-- <button class="table-operation-item" @click="$emit('del',scope.row)" v-has="'system_apiKey_delete'"><i class="nz-icon nz-icon-delete"></i></button> -->
+           <div @click="tableOperation(scope.row)" v-has="'system_apiKey_delete'">
+              <delete-button
+              ref="deleteButton"
+              :forceDeleteShow="false"
+              id="self-apiKey-delete"
+              :from="'selfApiKey'"
+              :type="'btn'"
+              :api="api"
+              :single="true"
+              :delete-objs="singleDelete"
+               @before="delFlag=true"
+              ></delete-button>
+            </div>
           </template>
         </div>
       </el-table-column>
@@ -86,11 +99,13 @@
 <script>
 import { tableCommon } from './systemCommon'
 import table from '@/components/common/mixin/table'
+import deleteButton from '@/components/common/deleteButton'
 export default {
-  name: 'apiKeyTable',
+  name: 'selfApiKeyTable',
   props: {
     loading: Boolean
   },
+  components: { deleteButton },
   mixins: [table, tableCommon],
   data () {
     return {
@@ -127,7 +142,7 @@ export default {
           show: true
         }
       ],
-      reg: new RegExp("(?<=.{8}).", 'g')
+      reg: new RegExp('(?<=.{8}).', 'g')
     }
   },
   methods: {
@@ -138,6 +153,14 @@ export default {
     //     return bus.timeFormate(new Date(data), 'YYYY-MM-DD HH:mm:ss')
     //   }
     // }
+    tableOperation (row) {
+      if (this.singleDelete.length === 0) {
+        this.singleDelete.push(row)
+      } else {
+        this.singleDelete = []
+        this.singleDelete.push(row)
+      }
+    }
   },
   created () {
   },
diff --git a/nezha-fronted/src/components/page/config/template/chartTemp.vue b/nezha-fronted/src/components/page/config/template/chartTemp.vue
index 53d6aa724..3956b616b 100644
--- a/nezha-fronted/src/components/page/config/template/chartTemp.vue
+++ b/nezha-fronted/src/components/page/config/template/chartTemp.vue
@@ -37,6 +37,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'chartTemp'"
                   :forceDeleteShow="false"
                   :type="'link'"
diff --git a/nezha-fronted/src/components/page/config/template/exprTemp.vue b/nezha-fronted/src/components/page/config/template/exprTemp.vue
index d0708e67f..d79ae24d0 100644
--- a/nezha-fronted/src/components/page/config/template/exprTemp.vue
+++ b/nezha-fronted/src/components/page/config/template/exprTemp.vue
@@ -30,6 +30,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'exprTemp'"
                   :forceDeleteShow="false"
                   :type="'link'"
diff --git a/nezha-fronted/src/components/page/config/user.vue b/nezha-fronted/src/components/page/config/user.vue
index d4d86194b..d68a25095 100644
--- a/nezha-fronted/src/components/page/config/user.vue
+++ b/nezha-fronted/src/components/page/config/user.vue
@@ -69,6 +69,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'user'"
           :forceDeleteShow="false"
           :deleteTitle="'config.user.user'"
diff --git a/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue b/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
index 31c9bd713..c5042f2a2 100644
--- a/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
+++ b/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
@@ -113,6 +113,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'endpoint'"
                   :forceDeleteShow="false"
                   :deleteTitle="'project.endpoint.endpoint'"
diff --git a/nezha-fronted/src/components/page/monitor/module/moduleList.vue b/nezha-fronted/src/components/page/monitor/module/moduleList.vue
index 79ad8846c..519a1c3a5 100644
--- a/nezha-fronted/src/components/page/monitor/module/moduleList.vue
+++ b/nezha-fronted/src/components/page/monitor/module/moduleList.vue
@@ -104,6 +104,7 @@
               <el-dropdown-item :disabled="batchDeleteObjs.length==0">
                 <delete-button
                   ref="deleteButton"
+                  :single="false"
                   :from="'module'"
                   :forceDeleteShow="true"
                   :deleteTitle="'project.module.module'"
diff --git a/nezha-fronted/src/components/page/monitor/project/projectList.vue b/nezha-fronted/src/components/page/monitor/project/projectList.vue
index 473bdfe0f..76d8cdedf 100644
--- a/nezha-fronted/src/components/page/monitor/project/projectList.vue
+++ b/nezha-fronted/src/components/page/monitor/project/projectList.vue
@@ -16,6 +16,7 @@
         </button>
         <delete-button
           ref="deleteButton"
+          :single="false"
           :from="'project'"
           :forceDeleteShow="true"
           :deleteTitle="'overall.project'"