【需求 20331】 perf: 优化mesagebox组件

src/components/common/UploadFile/index.vue

@@ -29,6 +29,7 @@ import { uploadFile as uploadFileApi } from '@/api'
 import type { UploadProps, UploadUserFile } from 'element-plus'
 import type { UploadFileProps } from './types'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
 
 const props = withDefaults(defineProps<UploadFileProps>(), {
   limit: 2,
@@ -38,6 +39,7 @@ const props = withDefaults(defineProps<UploadFileProps>(), {
 const modelValue = defineModel<T>({
   required: true,
 })
+const { confirm } = useMessageBox()
 
 const fileList = ref<UploadUserFile[]>([])
 const uploadRef = useTemplateRef('uploadRef')
@@ -171,10 +173,11 @@ const handleChange: UploadProps['onChange'] = async (uploadFile, uploadFiles) =>
 }
 
 const handleBeforeRemove: UploadProps['beforeRemove'] = () => {
-  return ElMessageBox.confirm('确定要删除这个文件吗？', '提示', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning',
+  return confirm({
+    title: '确定要删除这个文件吗？',
+    confirmText: '确定',
+    cancelText: '取消',
+    type: 'danger',
   })
     .then(() => true)
     .catch(() => false)

src/views/backend/carousel/index.vue

@@ -191,8 +191,11 @@ import { ArticleTypeEnum, articleTypeListOptions } from '@/constants'
 import { usePageSearch, useNavigation } from '@/hooks'
 import dayjs from 'dayjs'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
 const router = useRouter()
 const { jumpToArticleDetailPage } = useNavigation()
+const { confirm } = useMessageBox()
 // 列表数据
 const loading = ref(false)
 const list = ref<BackendCarouselListItemDto[]>([])
@@ -254,13 +257,15 @@ const handleEdit = (row: BackendCarouselListItemDto) => {
 
 // 删除
 const handleDelete = async (row: BackendCarouselListItemDto) => {
-  try {
-    await ElMessageBox.confirm('确定要删除该轮播吗?', '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    })
+  await confirm({
+    title: '提示',
+    message: '确定要删除该轮播吗?',
+    confirmText: '确定',
+    cancelText: '取消',
+    type: 'danger',
+  })
 
+  try {
     await editCarousel({
       ...row,
       id: row.id,

src/views/backend/caseManage/index.vue

@@ -296,6 +296,9 @@ import dayjs from 'dayjs'
 import ErrorListDialog from './components/errorListDialog.vue'
 import EditDialog from './components/editDialog.vue'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+const { confirm } = useMessageBox()
+
 const { loading, list, total, reset, goToPage, changePageSize, refresh, searchParams } =
   usePageSearch(getCaseList, {
     defaultParams: {},
@@ -309,9 +312,11 @@ const handleEdit = async (row: BackendCaseListItemDto) => {
   if (row.isUse === UsageStatusEnum.USED) return push.warning('已使用的状态 不允许编辑')
   // 审核通过再编辑
   if (row.isAudit === AuditStatusEnum.AGREED) {
-    await ElMessageBox.confirm('案例库已审核通过，修改后需重新审核，点击确定继续编辑', '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
+    await confirm({
+      title: '提示',
+      message: '案例库已审核通过，修改后需重新审核，点击确定继续编辑',
+      confirmText: '确定',
+      cancelText: '取消',
       type: 'warning',
     })
   }

src/views/backend/columnsMenu/columnManage/index.vue

@@ -132,6 +132,9 @@ import type { FormInstance, FormRules } from 'element-plus'
 import type { BackendColumnListItemDto, AddOrUpdateColumnDto } from '@/api/backend'
 import dayjs from 'dayjs'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const { loading, list, total, reset, goToPage, changePageSize, refresh, searchParams, search } =
   usePageSearch(listOfCultureColumn, {
     defaultParams: {
@@ -187,13 +190,13 @@ const handleStatusChange = async (row: BackendColumnListItemDto) => {
 
 // 删除
 const handleDelete = async (row: BackendColumnListItemDto) => {
-  try {
-    await ElMessageBox.confirm(`确定要删除标签"${row.title}"吗?`, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    })
+  await confirm({
+    title: '提示',
+    message: `确定要删除专栏"${row.title}"吗?`,
+    type: 'danger',
+  })
 
+  try {
     await deleteColumn([row.id])
 
     push.success('删除成功')

src/views/backend/columnsMenu/interviewManage/index.vue

@@ -138,6 +138,9 @@ import type { FormInstance, FormRules } from 'element-plus'
 import type { BackendColumnListItemDto, AddOrUpdateColumnDto } from '@/api/backend'
 import dayjs from 'dayjs'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const { loading, list, total, reset, goToPage, changePageSize, refresh, searchParams, search } =
   usePageSearch(listOfCultureColumn, {
     defaultParams: {
@@ -193,13 +196,12 @@ const handleStatusChange = async (row: BackendColumnListItemDto) => {
 
 // 删除
 const handleDelete = async (row: BackendColumnListItemDto) => {
+  await confirm({
+    title: '提示',
+    message: `确定要删除专访"${row.title}"吗?`,
+    type: 'danger',
+  })
   try {
-    await ElMessageBox.confirm(`确定要删除标签"${row.title}"吗?`, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    })
-
     await deleteColumn([row.id])
 
     push.success('删除成功')

src/views/backend/columnsMenu/videoManage/index.vue

@@ -131,6 +131,9 @@ import type { FormInstance, FormRules } from 'element-plus'
 import type { BackendColumnListItemDto, AddOrUpdateColumnDto } from '@/api/backend'
 import dayjs from 'dayjs'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const { loading, list, total, reset, goToPage, changePageSize, refresh, searchParams, search } =
   usePageSearch(listOfCultureColumn, {
     defaultParams: {
@@ -187,10 +190,10 @@ const handleStatusChange = async (row: BackendColumnListItemDto) => {
 // 删除
 const handleDelete = async (row: BackendColumnListItemDto) => {
   try {
-    await ElMessageBox.confirm(`确定要删除标签"${row.title}"吗?`, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
+    await confirm({
+      title: '提示',
+      message: `确定要删除视频"${row.title}"吗?`,
+      type: 'danger',
     })
 
     await deleteColumn([row.id])

src/views/backend/goodsDistribution/index.vue

@@ -175,6 +175,9 @@ import dayjs from 'dayjs'
 import ExportExcelBtn from '@/components/common/ExportExcelBtn/index.vue'
 import type { ExportColumn } from '@/utils'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const { loading, list, total, reset, goToPage, changePageSize, refresh, searchParams, search } =
   usePageSearch(getBackendExchangeList, {
     defaultParams: {},
@@ -265,9 +268,12 @@ const formRules: FormRules = {
 
 // 取消发放
 const handleCancelIssue = async (row: BackendColumnListItemDto) => {
-  await ElMessageBox.confirm('确定要取消发放吗?', '提示', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
+  await confirm({
+    title: '提示',
+    message: '确定要取消发放吗?',
+    confirmText: '确定',
+    cancelText: '取消',
+    type: 'warning',
   })
   await issueProduct({
     id: row.id,

src/views/backend/settingsMenu/auctionManage/index.vue

@@ -226,6 +226,9 @@ import UploadFile from '@/components/common/UploadFile/index.vue'
 import AuctionRecordDialog from './components/auctionRecordDialog.vue'
 import dayjs from 'dayjs'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const { loading, list, total, reset, goToPage, changePageSize, refresh, searchParams, search } =
   usePageSearch(getBackendAuctionList)
 
@@ -301,13 +304,12 @@ const handleEdit = (row: BackendAddOrUpdateAuctionItemDto) => {
 
 // 删除
 const handleDelete = async (row: BackendAuctionListItemDto) => {
+  await confirm({
+    title: '提示',
+    message: `确定要删除竞拍物品"${row.name}"吗?`,
+    type: 'danger',
+  })
   try {
-    await ElMessageBox.confirm(`确定要删除竞拍物品"${row.name}"吗?`, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    })
-
     await deleteAuction([row.id])
     refresh()
     push.success('删除成功')
@@ -382,10 +384,10 @@ const handleBatchShow = async () => {
 }
 
 const handleBatchDelete = async () => {
-  await ElMessageBox.confirm('确定要删除这些竞拍物品吗?', '提示', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning',
+  await confirm({
+    title: '提示',
+    message: '确定要删除这些竞拍物品吗?',
+    type: 'danger',
   })
 
   await deleteAuction(selectedRows.value.map((item) => item.id))

src/views/backend/settingsMenu/dailyLotteryManage/index.vue

@@ -130,6 +130,9 @@ import UploadFile from '@/components/common/UploadFile/index.vue'
 import dayjs from 'dayjs'
 import LotteryConfig from './components/lotteryConfigDialog.vue'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const { loading, list, total, reset, goToPage, changePageSize, refresh, searchParams, search } =
   usePageSearch(getLotteryPrizeList)
 
@@ -172,13 +175,13 @@ const handleEdit = (row: BackendAddOrUpdateLotteryPrizeDto) => {
 
 //
 const handleDelete = async (row: BackendAuctionListItemDto) => {
-  try {
-    await ElMessageBox.confirm(`确定要删除竞拍物品"${row.name}"吗?`, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    })
+  await confirm({
+    title: '提示',
+    message: `确定要删除奖品"${row.name}"吗?`,
+    type: 'danger',
+  })
 
+  try {
     await deleteLotteryPrize([row.id])
     refresh()
     push.success('删除成功')

src/views/backend/settingsMenu/goodsManage/index.vue

@@ -195,7 +195,9 @@ import { BooleanFlag, ShopGoodsTypeEnum, regionListOptions } from '@/constants'
 import UploadFile from '@/components/common/UploadFile/index.vue'
 import type { BackendShopItemDto } from '@/api/backend'
 import { push } from 'notivue'
-console.log('goodsManage', UploadFile)
+import { useMessageBox } from '@/hooks'
+const { confirm } = useMessageBox()
+
 const { loading, list, total, reset, goToPage, changePageSize, refresh, searchParams, search } =
   usePageSearch(getShopItemList)
 
@@ -243,13 +245,13 @@ const handleEdit = (row: BackendColumnListItemDto) => {
 
 // 删除
 const handleDelete = async (row: BackendColumnListItemDto) => {
-  try {
-    await ElMessageBox.confirm(`确定要删除商品"${row.name}"吗?`, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    })
+  await confirm({
+    title: '提示',
+    message: `确定要删除商品"${row.name}"吗?`,
+    type: 'danger',
+  })
 
+  try {
     await deleteShopItem(row.id)
     refresh()
     push.success('删除成功')
@@ -293,7 +295,6 @@ const handleSelectionChange = (selection: BackendColumnListItemDto[]) => {
 }
 
 const handleEnableChange = async (row: BackendColumnListItemDto) => {
-  console.log(row)
   await addOrUpdateShopItem({
     id: row.id,
     enable: row.enable === BooleanFlag.YES ? BooleanFlag.NO : BooleanFlag.YES,

src/views/backend/tags/index.vue

@@ -127,6 +127,9 @@ import type { FormInstance, FormRules } from 'element-plus'
 
 import type { BackendTagListItemDto, AddOrUpdateTagDto } from '@/api/backend'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const { loading, list, total, reset, goToPage, changePageSize, refresh, searchParams, search } =
   usePageSearch(getTagList)
 
@@ -173,13 +176,13 @@ const handleEdit = (row: BackendTagListItemDto) => {
 
 // 删除
 const handleDelete = async (row: BackendTagListItemDto) => {
-  try {
-    await ElMessageBox.confirm(`确定要删除标签"${row.title}"吗?`, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    })
+  await confirm({
+    title: '提示',
+    message: `确定要删除标签"${row.title}"吗?`,
+    type: 'danger',
+  })
 
+  try {
     await deleteTag(row.id)
 
     push.success('删除成功')

src/views/publishCase/index.vue

@@ -132,6 +132,9 @@ import { storeToRefs } from 'pinia'
 import type { ISelectDept } from '@/utils/wxUtil'
 import BackButton from '@/components/common/BackButton/index.vue'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const router = useRouter()
 const userStore = useUserStore()
 const { userInfo } = storeToRefs(userStore)
@@ -238,9 +241,9 @@ const handleSubmit = async (releaseStatus: ReleaseStatusTypeEnum) => {
   await formRef.value?.validate()
 
   if (showSubmitGuide.value) {
-    await ElMessageBox.confirm('该案例库已审核通过，修改后需重新审核,确定提交吗?', '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
+    await confirm({
+      title: '提示',
+      message: '该案例库已审核通过，修改后需重新审核,确定提交吗?',
       type: 'warning',
     })
   }

src/views/userPage/components/selfCase.vue

@@ -117,6 +117,9 @@ import { ReleaseStatusTypeEnum, AuditStatusEnum, UsageStatusEnum } from '@/const
 import type { TabPaneName } from 'element-plus'
 import type { SelfCaseItemDto } from '@/api/user/types'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const router = useRouter()
 
 const caseTypeListOptions = [
@@ -258,10 +261,10 @@ const handleEdit = async (item: SelfCaseItemDto) => {
 }
 
 const handleDelete = async (item: SelfCaseItemDto) => {
-  await ElMessageBox.confirm('确定删除该案例吗？', '提示', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning',
+  await confirm({
+    title: '提示',
+    message: '确定删除该案例吗？',
+    type: 'danger',
   })
   await deleteCase(item.id)
   push.success('删除成功')

src/views/userPage/components/selfComment.vue

@@ -107,6 +107,9 @@ import type { TabPaneName } from 'element-plus'
 import { IS_REAL_KEY } from '@/constants/symbolKey'
 import { useNavigation } from '@/hooks'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const route = useRoute()
 const isReal = inject(IS_REAL_KEY)
 
@@ -134,10 +137,10 @@ const { list, loading, searchParams, total, refresh, goToPage, changePageSize }
 )
 const { jumpToArticleDetailPage } = useNavigation()
 const handleDelete = async (id: number) => {
-  await ElMessageBox.confirm('确定删除该评论吗？', '提示', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning',
+  await confirm({
+    title: '提示',
+    message: '确定删除该评论吗？',
+    type: 'danger',
   })
   await deleteComment(id)
   push.success('删除成功')

src/views/userPage/components/selfDraft.vue

@@ -89,6 +89,9 @@ import { ArticleTypeEnum } from '@/constants/enums'
 import type { TabPaneName } from 'element-plus'
 import { IS_REAL_KEY } from '@/constants/symbolKey'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const router = useRouter()
 
 const isReal = inject(IS_REAL_KEY)
@@ -125,11 +128,12 @@ const handleEdit = (item: any) => {
 }
 
 const handleDelete = async (item: any) => {
-  await ElMessageBox.confirm('确定删除该草稿吗？', '提示', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning',
+  await confirm({
+    title: '提示',
+    message: '确定删除该草稿吗？',
+    type: 'danger',
   })
+
   await deleteArticle(item.id)
   refresh()
   push.success('删除成功')

src/views/userPage/components/selfPublish.vue

@@ -96,6 +96,9 @@ import type { TabPaneName } from 'element-plus'
 import { IS_REAL_KEY } from '@/constants/symbolKey'
 import { useNavigation } from '@/hooks'
 import { push } from 'notivue'
+import { useMessageBox } from '@/hooks'
+
+const { confirm } = useMessageBox()
 const router = useRouter()
 
 const isReal = inject(IS_REAL_KEY)
@@ -127,11 +130,12 @@ onActivated(() => {
 })
 
 const handleDelete = async (articleId: number) => {
-  await ElMessageBox.confirm('确定删除该吗？', '提示', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning',
+  await confirm({
+    title: '提示',
+    message: '确定删除该吗？',
+    type: 'danger',
   })
+
   await deleteArticle(articleId)
   refresh()
   push.success('删除成功')