feat: modal组件替换

src/components/modal.vue

@@ -1,9 +1,10 @@
 <template>
-  <a-modal title-align="start" modal-class="modal" body-class="body" v-bind="$attrs">
+  <Modal title-align="start" wrapClassName="modal" body-class="body" v-bind="$attrs" centered>
     <slot></slot>
-  </a-modal>
+  </Modal>
 </template>
 <script setup lang="ts">
+import { Modal } from 'ant-design-vue';
 </script>
 <style lang="scss">
 .modal {

src/layouts/Basic.vue

@@ -55,7 +55,7 @@ const checkHasInviteCode = () => {
 
 <template>
   <Layout :class="['layout-wrap', { mobile: appStore.hideMenu }]" class="h-full flex flex-col w-full">
-    <JoinModal v-model:visible="joinEnterpriseVisible" ref="joinModalRef" />
+    <JoinModal v-model:open="joinEnterpriseVisible" centered ref="joinModalRef" />
     <Layout.Header class="layout-header-wrap">
       <Navbar />
     </Layout.Header>

src/views/components/dataEngine/hotTranslation.vue

@@ -2,10 +2,7 @@
   <view>
     <topHeader ref="topHeaderRef" @search="search"></topHeader>
     <!-- tabel -->
-    <a-space
+    <a-space direction="vertical" class="bg-#fff rounded-8px w-100% py-0 px-20px mb-24px">
-      direction="vertical"
-      class="bg-#fff rounded-8px w-100% py-0 px-20px mb-24px"
-    >
       <div class="title-row">
         <span class="title mr-4px">行业热门话题洞察</span>
         <a-tooltip>
@@ -78,7 +75,14 @@
         </template>
       </a-table>
     </a-space>
-    <Modal v-model:open="visible" unmountOnClose centered wrapClassName="hot-translation-modal" width="640px" @cancel="handleCancel">
+    <Modal
+      v-model:open="visible"
+      unmountOnClose
+      centered
+      wrapClassName="hot-translation-modal"
+      width="640px"
+      @cancel="handleCancel"
+    >
       <template #title>
         <span style="text-align: left; width: 100%">行业热门话题洞察</span>
       </template>

src/views/components/management/account/index.vue

@@ -36,7 +36,7 @@
         </Button>
       </template>
     </a-table>
-    <Modal v-model:visible="addAccountVisible" width="480px" title="添加子账号" :okText="okText" @ok="handleOk" >
+    <Modal v-model:open="addAccountVisible" centered width="480px" title="添加子账号" :okText="okText" @ok="handleOk" >
       <div v-if="canAddAccount" class="add-account-container">
         <h2 class="add-account-title">生成企业专属链接，成员通过访问即可注册并加入企业账号。</h2>
         <p class="add-account-subtitle">子账号可独立登录，权限继承主账号配置。</p>
@@ -53,8 +53,8 @@
         <p class="cannot-add-account-subtitle">如需添加更多子账号，您可联系销售人员进行购买和权限扩展。</p>
       </div>
     </Modal>
-    <CustomerServiceModal v-model:visible="customerServiceVisible" />
+    <CustomerServiceModal v-model:open="customerServiceVisible" centered/>
-    <DeleteModal v-model:open="deleteVisible" :content="deleteTitle" @ok="handleDelete" @close="deleteVisible = false">
+    <DeleteModal v-model:open="deleteVisible" centered :content="deleteTitle" @ok="handleDelete" @cancel="deleteVisible = false">
     </DeleteModal>
   </div>
 </template>

src/views/components/management/enterprise/index.vue

@@ -14,7 +14,7 @@
         <Button class="edit-button" size="small" type="primary" ghost @click="handleUpdate">修改</Button>
       </template>
     </a-table>
-    <Modal v-model:visible="infoVisible" width="480px" title="修改企业名称" :okText="okText" @ok="handleOk">
+    <Modal v-model:open="infoVisible" width="480px" centered title="修改企业名称" :okText="okText" @ok="handleOk">
       <p class="tips">
         企业名称只能修改2次，请谨慎操作。<span
           >（剩余{{ enterpriseInfo!.update_name_quota - enterpriseInfo!.used_update_name_count }}次）
@@ -32,7 +32,7 @@
         </a-form-item>
       </a-form>
     </Modal>
-    <CustomerServiceModal v-model:visible="customerServiceVisible" />
+    <CustomerServiceModal v-model:open="customerServiceVisible" centered />
   </div>
 </template>
 <script setup lang="ts">

src/views/components/management/person/index.vue

@@ -19,7 +19,7 @@
         <icon-edit size="13" class="ml-8px" @click="openEditMobileModal" />
       </template>
     </a-table>
-    <Modal v-model:visible="infoVisible" title="修改用户信息" @ok="handleSubmitUserInfo">
+    <Modal v-model:open="infoVisible" centered title="修改用户信息" @ok="handleSubmitUserInfo">
       <a-form
         class="form"
         :model="userInfoForm"
@@ -46,10 +46,10 @@
         </a-form-item>
       </a-form>
     </Modal>
-    <Modal v-model:visible="imageVisible" title="头像裁剪">
+    <Modal v-model:open="imageVisible" centered title="头像裁剪">
       <VueCropper></VueCropper>
     </Modal>
-    <Modal v-model:visible="mobileVisible" title="修改手机号" @ok="handleUpdateMobile">
+    <Modal v-model:open="mobileVisible" centered title="修改手机号" @ok="handleUpdateMobile">
       <a-form
         ref="formRef"
         :model="form"

src/views/components/workplace/modules/product.vue

@@ -64,7 +64,7 @@
         <Button v-if="props.product.status === Status.Disable" size="small" type="default" ghost> 免费试用7天 </Button>
       </a-popconfirm>
     </div>
-    <CustomerServiceModal v-model:visible="visible" />
+    <CustomerServiceModal v-model:open="visible" centered/>
   </div>
 </template>
 

src/views/material-center/components/finished-products/manuscript/check-list/components/manuscript-check-table/delete-manuscript-modal.vue

@@ -1,9 +1,10 @@
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     title="删除内容稿件"
     width="480px"
-    @close="onClose"
+    centered
+    @cancel="onClose"
   >
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
@@ -15,12 +16,12 @@
         >确认删除</Button
       >
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { deleteWork } from '@/api/all/generationWorkshop';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 

src/views/material-center/components/finished-products/manuscript/check/cancel-check-modal.vue

@@ -1,9 +1,10 @@
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     :title="action === 'exit' ? '退出审核' : '切换内容稿件'"
     width="480px"
-    @close="onClose"
+    centered
+    @cancel="onClose"
   >
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
@@ -19,12 +20,12 @@
         {{ action === 'exit' ? '确认退出' : '确认切换' }}
       </Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 import { useRouter } from 'vue-router';
 

src/views/material-center/components/finished-products/manuscript/check/check-success-modal.vue

@@ -1,10 +1,11 @@
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     title="提示"
     width="480px"
     @close="onClose"
-    modal-class="upload-success11-modal"
+    centered
+    wrapClassName="upload-success11-modal"
     :footer="null"
   >
     <div class="flex items-center flex-col justify-center">
@@ -13,11 +14,12 @@
       <p class="text-14px lh-22px font-400 color-#737478 ld">想让内容更抓眼球、更吸流量吗？</p>
       <p class="text-14px lh-22px font-400 color-#737478 ld">试试「内容稿件分析」功能吧！</p>
     </div>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
+import { Button, Modal } from 'ant-design-vue';
 import icon1 from '@/assets/img/media-account/icon-feedback-success.png';
 
 const router = useRouter();

src/views/material-center/components/finished-products/manuscript/components/share-manuscript-modal/index.vue

@@ -1,6 +1,6 @@
 <script lang="jsx">
 import { Button } from 'ant-design-vue';
-import { Table, Modal, TableColumn, Pagination, Tooltip } from '@arco-design/web-vue';
+import { Table, TableColumn, Pagination, Tooltip, Modal } from '@arco-design/web-vue';
 import CommonSelect from '@/components/common-select';
 import TextOverTips from '@/components/text-over-tips';
 import ShareModal from '@/views/material-center/components/finished-products/manuscript/components/share-manuscript-modal/share-modal';
@@ -126,12 +126,13 @@ export default {
     return () => (
       <>
         <Modal
-          v-model:visible={visible.value}
+          v-model:open={visible.value}
           title="分享内容稿件"
           width="920px"
-          onClose={onClose}
+          onCancel={onClose}
-          unmount-on-close
+          centered
-          modal-class="share-manuscript-modal"
+          destroyOnClose
+          modalClass="share-manuscript-modal"
           v-slots={{
             footer: () => (
               <div class="flex justify-between w-full items-center">

src/views/material-center/components/finished-products/manuscript/components/share-manuscript-modal/share-modal.vue

@@ -1,6 +1,6 @@
 <script lang="jsx">
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
-import { Modal, Form, FormItem, Input, Message as AMessage } from '@arco-design/web-vue';
+import { Form, FormItem, Input, Message as AMessage } from '@arco-design/web-vue';
 import CommonSelect from '@/components/common-select';
 
 import { useClipboard } from '@vueuse/core';
@@ -97,11 +97,12 @@ export default {
     });
     return () => (
       <Modal
-        v-model:visible={visible.value}
+        v-model:open={visible.value}
         title="分享内容稿件"
         width="480px"
-        onClose={onClose}
+        onCancel={onClose}
-        unmount-on-close
+        destroyOnClose
+        centered
         auto-label-width
         v-slots={{
           footer: () => (

src/views/material-center/components/finished-products/manuscript/components/upload-manuscript-modal/index.vue

@@ -1,16 +1,6 @@
 <script lang="jsx">
-import {
+import { Modal, Button } from 'ant-design-vue';
-  Modal,
+import { Form, FormItem, Input, RadioGroup, Radio, Upload, Message as AMessage, Textarea } from '@arco-design/web-vue';
-  Form,
-  FormItem,
-  Input,
-  RadioGroup,
-  Radio,
-  Upload,
-  Button,
-  Message as AMessage,
-  Textarea,
-} from '@arco-design/web-vue';
 import { useClipboard } from '@vueuse/core';
 import { getWriterLinksGenerate, getTemplateUrl, postWorksByLink, postWorksByFile } from '@/api/all/generationWorkshop';
 import { generateFullUrl } from '@/utils/tools';
@@ -332,36 +322,30 @@ export default {
     const renderFooterButtons = () => {
       const buttonMap = {
         [TASK_STATUS.LOADING]: () => (
-          <Button type="primary" size="medium" onClick={onCancelUpload}>
+          <Button type="primary" onClick={onCancelUpload}>
             取消上传
           </Button>
         ),
         [TASK_STATUS.DEFAULT]: () => (
           <>
-            <Button size="medium" onClick={onClose}>
+            <Button onClick={onClose}>取消</Button>
-              取消
+            <Button type="primary" onClick={onSubmit}>
-            </Button>
-            <Button type="primary" size="medium" onClick={onSubmit}>
               {isHandwrite.value ? '复制链接' : '确认'}
             </Button>
           </>
         ),
         [TASK_STATUS.FAILED]: () => (
           <>
-            <Button size="medium" onClick={onClose}>
+            <Button onClick={onClose}>取消</Button>
-              取消
+            <Button type="primary" onClick={onClose}>
-            </Button>
-            <Button type="primary" size="medium" onClick={onClose}>
               重新上传
             </Button>
           </>
         ),
         [TASK_STATUS.SUCCESS]: () => (
           <>
-            <Button size="medium" onClick={onClose}>
+            <Button onClick={onClose}>取消</Button>
-              取消
+            <Button type="primary" onClick={goUpload}>
-            </Button>
-            <Button type="primary" size="medium" onClick={goUpload}>
               确认
             </Button>
           </>
@@ -375,13 +359,15 @@ export default {
 
     return () => (
       <Modal
-        v-model:visible={visible.value}
+        centered
+        v-model:open={visible.value}
         title={getTitle()}
-        modal-class="upload-manuscript-modal"
+        wrapClassName="upload-manuscript-modal"
         width="500px"
-        mask-closable={false}
+        maskClosable={false}
-        unmount-on-close
+        destroyOnClose
-        onClose={onClose}
+        centered
+        onCancel={onClose}
         footer={!(isDefault.value && isLocal.value)}
         v-slots={{
           footer: () => renderFooterButtons(),

src/views/material-center/components/finished-products/manuscript/edit/cancel-edit-modal.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model:visible="visible" title="退出编辑" width="480px" @close="onClose">
+  <Modal v-model:open="visible" title="退出编辑" centered width="480px" @cancel="onClose">
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>内容已修改尚未保存，若退出编辑，本次修改将不保存。</span>
@@ -8,12 +8,12 @@
       <Button size="medium" @click="onClose">继续编辑</Button>
       <Button type="primary" class="ml-8px" size="medium" @click="onConfirm">确认退出</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 
 const router = useRouter();

src/views/material-center/components/finished-products/manuscript/list/components/manuscript-table/delete-manuscript-modal.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model:visible="visible" title="删除稿件" width="480px" @close="onClose">
+  <Modal v-model:open="visible" title="删除稿件" centered width="480px" @cancel="onClose">
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认删除 {{ projectName }} 这个稿件吗？</span>
@@ -8,12 +8,12 @@
       <Button size="large" @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" danger size="large" @click="onDelete">确认删除</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { deleteWork } from '@/api/all/generationWorkshop';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 

src/views/material-center/components/finished-products/manuscript/upload/cancel-upload-modal.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model:visible="visible" title="确认提示" width="480px" @close="onClose">
+  <Modal v-model:open="visible" centered title="确认提示" width="480px" @cancel="onClose">
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认取消上传这 {{ num }} 个文件吗？此操作不可恢复。</span>
@@ -8,12 +8,12 @@
       <Button size="medium" @click="onClose">继续编辑</Button>
       <Button type="primary" class="ml-8px" size="medium" @click="onConfirm">确认取消</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 
 const router = useRouter();

src/views/material-center/components/finished-products/manuscript/upload/upload-success-modal.vue

@@ -1,5 +1,12 @@
 <template>
-  <a-modal v-model:visible="visible" title="提示" width="480px" @close="onClose" modal-class="upload-success11-modal">
+  <Modal
+    v-model:open="visible"
+    title="提示"
+    centered
+    width="480px"
+    @cancel="onClose"
+    wrapClassName="upload-success11-modal"
+  >
     <div class="flex items-center flex-col justify-center">
       <img :src="icon1" width="80" height="80" class="mb-16px" />
       <span class="text-18px lh-26px font-400 color-#211F24 md">上传成功</span>
@@ -10,12 +17,12 @@
       <Button size="medium" @click="onBack">回到列表</Button>
       <Button type="primary" class="ml-8px" size="medium" @click="onConfirm">批量审核</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { slsWithCatch } from '@/utils/stroage.ts';
 import icon1 from '@/assets/img/media-account/icon-feedback-success.png';
 

src/views/material-center/components/raw-material/components/table/delete-file-modal.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model:visible="visible" title="删除文件" width="480px" @close="onClose">
+  <Modal v-model:open="visible" title="删除文件" centered width="480px" @cancel="onClose">
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认删除 {{ fileName }} 文件吗？</span>
@@ -8,12 +8,12 @@
       <Button size="medium" @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" danger size="medium" @click="onDelete">确认删除</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { deleteRawMaterial, batchDeleteRawMaterials } from '@/api/all/generationWorkshop';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 

src/views/material-center/components/raw-material/index.vue

@@ -106,7 +106,14 @@ export default defineComponent({
         </div>
         <div class="table-wrap bg-#fff rounded-8px px-24px py-24px flex flex-col">
           <div class="flex justify-end mb-12px">
-            <Button type="primary" ghost class="w-fit" size="medium" onClick={handleBatchDelete}>
+            <Button
+              type="primary"
+              ghost
+              class="w-fit"
+              size="medium"
+              onClick={handleBatchDelete}
+              disabled={!selectedRows.value.length}
+            >
               批量删除
             </Button>
           </div>

src/views/property-marketing/brands/brand-materials/index.vue

@@ -35,9 +35,10 @@
             </Button>
           </div>
         </div>
-        <a-modal
+        <Modal
-          v-model:visible="modalVisible"
+          v-model:open="modalVisible"
-          :mask-closable="false"
+          :maskClosable="false"
+          centered
           :esc-to-close="false"
           width="510px"
           @cancel="handleModalCancel"
@@ -68,7 +69,7 @@
             <Button @click="handleModalCancel" class="mr-8px">取消</Button>
             <Button type="primary" @click="handleModalOk">{{ btn_str }}</Button>
           </template>
-        </a-modal>
+        </Modal>
       </div>
     </div>
     <div
@@ -127,7 +128,7 @@
 import { ref, computed, reactive, onMounted } from 'vue';
 import { Message } from '@arco-design/web-vue';
 import { IconDelete } from '@arco-design/web-vue/es/icon';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 
 import {
   addMaterials,

src/views/property-marketing/media-account/account-manage/components/account-table/pause-account-patch.vue

@@ -3,7 +3,14 @@
  * @Date: 2025-06-27 14:41:20
 -->
 <template>
-  <a-modal v-model:visible="visible" title="暂停同步" width="400px" modal-class="account-manage-modal" @close="onClose">
+  <Modal
+    v-model:open="visible"
+    title="暂停同步"
+    centered
+    width="400px"
+    wrapClassName="account-manage-modal"
+    @cancel="onClose"
+  >
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认暂停同步 “{{ accountName }}” 这个账号的数据吗？</span>
@@ -12,11 +19,11 @@
       <Button size="large" @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" size="large" @click="onConfirm">确定</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { ref } from 'vue';
 import { pausePatchAccount } from '@/api/all/propertyMarketing';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';

src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue

@@ -4,9 +4,8 @@
 -->
 <script lang="jsx">
 import { ref, computed } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import {
-  Modal,
   Form,
   FormItem,
   Input,
@@ -277,12 +276,13 @@ export default {
 
     return () => (
       <Modal
-        v-model:visible={visible.value}
+        v-model:open={visible.value}
         title={isEdit.value ? '编辑账号' : '添加账号'}
-        modal-class="add-account-modal"
+        wrapClassName="add-account-modal"
         width="500px"
-        mask-closable={false}
+        centered
-        onClose={onClose}
+        maskClosable={false}
+        onCancel={onClose}
         footer={null}
       >
         <Form ref={formRef} model={form.value} rules={rules} layout="horizontal" auto-label-width>
@@ -394,7 +394,12 @@ export default {
               </FormItem>
 
               <FormItem label="选择标签">
-                <CommonSelect v-model={form.value.tag_ids} options={tagOptions.value} placeholder="请选择…" size="large" />
+                <CommonSelect
+                  v-model={form.value.tag_ids}
+                  options={tagOptions.value}
+                  placeholder="请选择…"
+                  size="large"
+                />
               </FormItem>
               <FormItem
                 label="笔记链接"

src/views/property-marketing/media-account/account-manage/components/authorized-account-modal/index.vue

@@ -3,14 +3,15 @@
  * @Date: 2025-06-25 17:51:46
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     width="480px"
     title="授权账号"
-    modal-class="authorized-account-modal"
+    centered
-    :mask-closable="false"
+    wrapClassName="authorized-account-modal"
+    :maskClosable="false"
     :footer="modalState !== MODAL_STATE.LOADING"
-    @close="close"
+    @cancel="close"
   >
     <div class="flex flex-col items-center">
       <!-- 加载中状态 -->
@@ -86,7 +87,7 @@
         {{ confirmBtnText }}
       </Button>
     </template>
-  </a-modal>
+  </Modal>
 
   <SyncDataModal ref="syncDataModalRef" />
 </template>
@@ -94,7 +95,7 @@
 <script setup>
 import { defineExpose, ref, computed } from 'vue';
 import { Message as AMessage } from '@arco-design/web-vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { getAuthorizedImage, getMediaAccountsAuthorizedStatus } from '@/api/all/propertyMarketing';
 import SyncDataModal from '../sync-data-modal';
 

src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/index.vue

@@ -3,12 +3,13 @@
  * @Date: 2025-06-27 09:35:49
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     title="批量标签"
-    modal-class="batch-tag-modal"
+    wrapClassName="batch-tag-modal"
     width="800px"
-    :mask-closable="false"
+    centered
+    :maskClosable="false"
   >
     <div class="mb-16px t1">
       {{ `已选${accountTagList.length}个账号` }}
@@ -79,12 +80,12 @@
       <Button size="large" @click="onClose">取消</Button>
       <Button type="primary" size="large" @click="onSubmit">确定</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref, reactive } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { fetchAccountTags, batchPutTag } from '@/api/all/propertyMarketing';
 
 import icon1 from '@/assets/img/icon-question.png';

src/views/property-marketing/media-account/account-manage/components/group-manage-modal/add-group.vue

@@ -3,12 +3,13 @@
  * @Date: 2025-06-26 11:44:17
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     :title="isEdit ? '编辑分组' : '添加新分组'"
-    modal-class="account-manage-modal"
+    wrapClassName="group-manage-modal"
     width="400px"
-    @close="onClose"
+    centered
+    @cancel="onClose"
   >
     <a-form ref="formRef" :model="form" :rules="rules" layout="horizontal" auto-label-width>
       <a-form-item :label="isEdit ? '分组名称' : '新分组名称'" field="name" required>
@@ -19,12 +20,12 @@
       <Button @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" @click="onSubmit">确认</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref, watch, nextTick } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { postAccountGroups, putGroup } from '@/api/all/propertyMarketing';
 
 const emits = defineEmits(['success', 'close']);

src/views/property-marketing/media-account/account-manage/components/group-manage-modal/delete-group.vue

@@ -3,7 +3,14 @@
  * @Date: 2025-06-26 11:45:05
 -->
 <template>
-  <a-modal v-model:visible="visible" title="删除分组" width="400px" modal-class="account-manage-modal" @close="onClose">
+  <Modal
+    v-model:open="visible"
+    title="删除分组"
+    centered
+    width="400px"
+    wrapClassName="account-manage-modal"
+    @cancel="onClose"
+  >
     <div class="flex items-center mb-24px">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认删除 "{{ groupName }}" 这个分组吗？</span>
@@ -12,12 +19,12 @@
       <Button size="large" @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" danger size="large" @click="onDelete">确认删除</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { deleteGroup } from '@/api/all/propertyMarketing';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 

src/views/property-marketing/media-account/account-manage/components/group-manage-modal/index.vue

@@ -3,14 +3,15 @@
  * @Date: 2025-06-25 17:51:46
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     width="900px"
-    modal-class="account-manage-modal"
+    wrapClassName="account-manage-modal"
     :footer="false"
+    centered
     title="分组管理"
-    :mask-closable="false"
+    :maskClosable="false"
-    @close="close"
+    @cancel="close"
   >
     <div class="flex items-center justify-between mb-16px">
       <div class="filter-row-item flex items-center">
@@ -76,12 +77,12 @@
 
     <AddGroup ref="addGroupRef" @success="update" />
     <DeleteGroup ref="deleteGroupRef" @success="update" />
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref, reactive, onMounted } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { getAccountGroup } from '@/api/all/propertyMarketing';
 import { exactFormatTime } from '@/utils/tools';
 

src/views/property-marketing/media-account/account-manage/components/import-prompt-modal/index.vue

@@ -3,13 +3,14 @@
  * @Date: 2025-06-25 17:51:46
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     width="480px"
     title="导入提示"
-    modal-class="import-prompt-modal"
+    wrapClassName="import-prompt-modal"
-    :mask-closable="false"
+    :maskClosable="false"
-    @close="close"
+    centered
+    @cancel="close"
   >
     <div class="flex flex-col items-center">
       <div class="flex items-center">
@@ -24,11 +25,11 @@
       <Button size="large" @click="close">取消</Button>
       <Button type="primary" size="large" @click="handleOk"> 去授权 </Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { defineExpose } from 'vue';
 
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';

src/views/property-marketing/media-account/account-manage/components/reauthorize-account-modal/index.vue

@@ -3,14 +3,15 @@
  * @Date: 2025-06-25 17:51:46
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     width="500px"
+    centered
     title="重新授权"
-    modal-class="reauthorize-account-modal"
+    wrapClassName="reauthorize-account-modal"
-    :mask-closable="false"
+    :maskClosable="false"
     :footer="modalState !== MODAL_STATE.LOADING"
-    @close="close"
+    @cancel="close"
   >
     <div class="flex flex-col items-center">
       <!-- 加载中状态 -->
@@ -92,9 +93,7 @@
     </div>
 
     <template #footer>
-      <Button v-if="modalState === MODAL_STATE.QR_READY" size="large" @click="handleRefreshQrCode">
+      <Button v-if="modalState === MODAL_STATE.QR_READY" size="large" @click="handleRefreshQrCode"> 重新生成 </Button>
-        重新生成
-      </Button>
       <Button
         v-if="modalState === MODAL_STATE.SUCCESS || modalState === MODAL_STATE.FAILED"
         size="large"
@@ -106,7 +105,7 @@
         {{ confirmBtnText }}
       </Button>
     </template>
-  </a-modal>
+  </Modal>
 
   <SyncDataModal ref="syncDataModalRef" />
 </template>
@@ -114,7 +113,7 @@
 <script setup>
 import { defineExpose, ref, computed } from 'vue';
 import { Message as AMessage } from '@arco-design/web-vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { getMediaAccountsAuthorizedStatus, getAuthorizedImage } from '@/api/all/propertyMarketing';
 import SyncDataModal from '../sync-data-modal';
 

src/views/property-marketing/media-account/account-manage/components/sync-data-modal/index.vue

@@ -3,13 +3,14 @@
  * @Date: 2025-06-25 17:51:46
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     width="480px"
     title="更新数据"
-    modal-class="sync-data-modal"
+    centered
-    :mask-closable="false"
+    wrapClassName="sync-data-modal"
-    @close="close"
+    :maskClosable="false"
+    @cancel="close"
   >
     <div class="flex flex-col items-center">
       <div class="flex items-center">
@@ -23,12 +24,12 @@
       <Button size="large" @click="close">稍后再说</Button>
       <Button type="primary" size="large" @click="handleOk"> 更新数据 </Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { defineExpose } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 

src/views/property-marketing/media-account/account-manage/components/tags-manage-modal/add-tag.vue

@@ -1,10 +1,11 @@
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     :title="isEdit ? '编辑标签' : '添加新标签'"
-    modal-class="tags-manage-modal"
+    wrapClassName="tags-manage-modal"
     width="400px"
-    @close="onClose"
+    centered
+    @cancel="onClose"
   >
     <a-form ref="formRef" :model="form" :rules="rules" layout="horizontal" auto-label-width>
       <a-form-item :label="isEdit ? '标签名称' : '新标签名称'" field="name" required>
@@ -15,12 +16,12 @@
       <Button @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" @click="onSubmit">确认</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref, nextTick } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { postAccountTags, putTag } from '@/api/all/propertyMarketing';
 
 const emits = defineEmits(['success', 'close']);

src/views/property-marketing/media-account/account-manage/components/tags-manage-modal/delete-tag.vue

@@ -3,18 +3,23 @@
  * @Date: 2025-06-26 17:23:52
 -->
 <template>
-  <a-modal v-model:visible="visible" title="删除标签" width="400px" modal-class="account-manage-modal" @close="onClose">
+  <Modal
+    v-model:open="visible"
+    title="删除标签"
+    centered
+    width="400px"
+    wrapClassName="account-manage-modal"
+    @cancel="onClose"
+  >
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认删除 "{{ tagName }}" 这个标签吗？</span>
     </div>
     <template #footer>
       <Button size="large" @click="onClose">取消</Button>
-      <Button type="primary" class="ml-16px" danger size="large" @click="onDelete"
+      <Button type="primary" class="ml-16px" danger size="large" @click="onDelete">确认删除</Button>
-        >确认删除</Button
-      >
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>

src/views/property-marketing/media-account/account-manage/components/tags-manage-modal/index.vue

@@ -3,14 +3,15 @@
  * @Date: 2025-06-25 17:58:28
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     width="800px"
-    modal-class="tags-manage-modal"
+    wrapClassName="tags-manage-modal"
     :footer="false"
+    centered
     title="标签管理"
-    :mask-closable="false"
+    :maskClosable="false"
-    @close="close"
+    @cancel="close"
   >
     <div class="flex items-center justify-between mb-16px">
       <div class="filter-row-item flex items-center">
@@ -55,12 +56,12 @@
 
     <AddTag ref="addTagRef" @success="update" />
     <DeleteTag ref="deleteTagRef" @success="update" />
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { getTagsList } from '@/api/all/propertyMarketing';
 
 import AddTag from './add-tag.vue';

src/views/property-marketing/project-manage/project-list/components/add-project-modal/index.vue

@@ -1,11 +1,12 @@
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     title="添加项目"
-    modal-class="add-project-modal"
+    wrapClassName="add-project-modal"
     width="960px"
-    :mask-closable="false"
+    centered
-    @close="onClose"
+    :maskClosable="false"
+    @cancel="onClose"
   >
     <div class="content">
       <a-steps changeable :current="currentStep" @change="setCurrent" class="mb-24px mx-79px">
@@ -25,12 +26,12 @@
         </div>
       </div>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { postAddProject, putProject, getProjectDetail } from '@/api/all/propertyMarketing';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 
 import StepOne from './stepOne.vue';
 import StepTwo from './stepTwo.vue';

src/views/property-marketing/project-manage/project-list/components/project-table/delete-project-modal.vue

@@ -3,12 +3,13 @@
  * @Date: 2025-06-26 17:44:16
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     title="删除项目"
     width="480px"
-    modal-class="project-manage-modal"
+    centered
-    @close="onClose"
+    wrapClassName="project-manage-modal"
+    @cancel="onClose"
   >
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
@@ -20,12 +21,12 @@
         >确认删除</Button
       >
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { deleteProject } from '@/api/all/propertyMarketing';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 

src/views/property-marketing/put-account/account-data/components/group-manage-modal/add-group.vue

@@ -3,12 +3,13 @@
  * @Date: 2025-06-26 11:44:17
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     :title="isEdit ? '编辑分组' : '添加新分组'"
-    modal-class="account-manage-modal"
+    wrapClassName="account-manage-modal"
     width="400px"
-    @close="onClose"
+    centered
+    @cancel="onClose"
   >
     <a-form ref="formRef" :model="form" :rules="rules" layout="horizontal" auto-label-width>
       <a-form-item :label="isEdit ? '分组名称' : '新分组名称'" field="name" required>
@@ -19,12 +20,12 @@
       <Button @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" @click="onSubmit">确认</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref, watch, nextTick } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { postPlacementAccountProjectGroups, putPlacementAccountProjectGroups } from '@/api/all/propertyMarketing';
 
 const emits = defineEmits(['success', 'close']);

src/views/property-marketing/put-account/account-data/components/group-manage-modal/delete-group.vue

@@ -3,7 +3,7 @@
  * @Date: 2025-06-26 11:45:05
 -->
 <template>
-  <a-modal v-model:visible="visible" title="删除分组" width="400px" modal-class="account-manage-modal" @close="onClose">
+  <Modal v-model:open="visible" centered title="删除分组" width="400px" wrapClassName="account-manage-modal" @cancel="onClose">
     <div class="flex items-center mb-24px">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认删除 "{{ groupName }}" 这个分组吗？</span>
@@ -12,12 +12,12 @@
       <Button size="large" @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px danger-btn" danger size="large" @click="onDelete">确认删除</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { deletePlacementAccountProjectGroups } from '@/api/all/propertyMarketing';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 

src/views/property-marketing/put-account/account-data/components/group-manage-modal/index.vue

@@ -3,14 +3,15 @@
  * @Date: 2025-06-25 17:51:46
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     width="900px"
-    modal-class="put-account-group-manage-modal"
+    wrapClassName="put-account-group-manage-modal"
     :footer="false"
     title="分组管理"
-    :mask-closable="false"
+    centered
-    @close="close"
+    :maskClosable="false"
+    @cancel="close"
   >
     <div class="flex items-center justify-between mb-16px">
       <div class="filter-row-item flex items-center">
@@ -75,12 +76,12 @@
 
     <AddGroup ref="addGroupRef" @success="update" />
     <DeleteGroup ref="deleteGroupRef" @success="update" />
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref, reactive, onMounted } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { getPlacementAccountProjectGroups } from '@/api/all/propertyMarketing';
 import { exactFormatTime } from '@/utils/tools';
 

src/views/property-marketing/put-account/account-manage/components/account-table/delete-account.vue

@@ -3,12 +3,13 @@
  * @Date: 2025-06-26 17:44:16
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     :title="isBatch ? '批量删除账户' : '删除账户'"
     width="480px"
-    modal-class="account-manage-modal"
+    centered
-    @close="onClose"
+    wrapClassName="account-manage-modal"
+    @cancel="onClose"
   >
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
@@ -18,10 +19,12 @@
       <Button size="large" @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" danger size="large" @click="onDelete">确认删除</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
+// 添加Modal导入
+import { Modal } from 'ant-design-vue';
 import { ref } from 'vue';
 import { Button } from 'ant-design-vue';
 import { deletePlacementAccount, batchDeletePlacementAccounts } from '@/api/all/propertyMarketing';

src/views/property-marketing/put-account/account-manage/components/account-table/pause-account-patch.vue

@@ -3,7 +3,14 @@
  * @Date: 2025-06-27 14:41:20
 -->
 <template>
-  <a-modal v-model:visible="visible" title="暂停同步" width="480px" modal-class="account-manage-modal" @close="onClose">
+  <Modal
+    v-model:open="visible"
+    title="暂停同步"
+    width="480px"
+    wrapClassName="account-manage-modal"
+    @cancel="onClose"
+    centered
+  >
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认暂停同步 “{{ accountName }}” 这个账号的数据吗？</span>
@@ -12,7 +19,7 @@
       <Button size="large" @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px !bg-#f64b31" size="large" @click="onConfirm">确定</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>

src/views/property-marketing/put-account/account-manage/components/add-account-modal/index.vue

@@ -3,14 +3,15 @@
  * @Date: 2025-06-25 17:51:46
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     :title="isEdit ? '编辑账户' : '添加账户'"
-    modal-class="add-put-account-modal"
+    wrapClassName="add-put-account-modal"
     width="500px"
-    :mask-closable="false"
+    :maskClosable="false"
     unmount-on-close
-    @close="onClose"
+    centered
+    @cancel="onClose"
   >
     <a-form ref="formRef" :model="form" :rules="rules" layout="horizontal" auto-label-width>
       <a-form-item v-if="!isEdit" label="上传方式" required>
@@ -142,10 +143,12 @@
 
     <AuthorizedAccountModal ref="authorizedAccountModalRef" />
     <!-- <ImportPromptModal ref="importPromptModalRef" /> -->
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
+// 添加Modal导入
+import { Modal } from 'ant-design-vue';
 import { ref, defineEmits } from 'vue';
 import { Button } from 'ant-design-vue';
 

src/views/property-marketing/put-account/account-manage/components/authorized-account-modal/index.vue

@@ -3,14 +3,15 @@
  * @Date: 2025-06-25 17:51:46
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     width="480px"
     title="获取凭证"
-    modal-class="authorized-account-modal"
+    wrapClassName="authorized-account-modal"
-    :mask-closable="false"
+    :maskClosable="false"
     :footer="!isLoading"
-    @close="close"
+    centered
+    @cancel="close"
   >
     <!-- <div v-if="showSyncTip">
       <div class="flex items-center mb-20px">
@@ -58,12 +59,14 @@
       <Button size="large" @click="close">取消</Button>
       <Button type="primary" size="large" @click="handleOk">{{ confirmBtnText }} </Button>
     </template>
-  </a-modal>
+  </Modal>
 
   <SelectSubAccountModal ref="selectSubAccountModalRef" />
 </template>
 
 <script setup>
+// 添加Modal导入
+import { Modal } from 'ant-design-vue';
 import dayjs from 'dayjs';
 import { Button } from 'ant-design-vue';
 import { defineExpose, ref, computed, defineEmits } from 'vue';

src/views/property-marketing/put-account/account-manage/components/import-prompt-modal/index.vue

@@ -3,13 +3,13 @@
  * @Date: 2025-06-25 17:51:46
 -->
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
     width="480px"
     title="导入提示"
-    modal-class="import-prompt-modal"
+    wrapClassName="import-prompt-modal"
-    :mask-closable="false"
+    :maskClosable="false"
-    @close="close"
+    @cancel="close"
   >
     <div class="flex flex-col items-center">
       <div class="flex items-center">
@@ -21,12 +21,12 @@
       <Button size="large" @click="close">取消</Button>
       <Button type="primary" size="large" @click="handleOk"> 去授权 </Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { defineExpose } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 

src/views/property-marketing/put-account/account-manage/components/select-sub-account-modal/index.vue

@@ -1,10 +1,12 @@
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
+    @cancel="onClose"
+    centered
     title="选择子账户"
     modal-class="select-sub-account-modal"
     width="720px"
-    :mask-closable="false"
+    :maskClosable="false"
     @close="onClose"
   >
     <div class="filter-row flex mb-16px">
@@ -109,7 +111,7 @@
         >
       </div>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
@@ -118,6 +120,7 @@ import { INITIAL_FORM, INITIAL_PAGE_INFO, TABLE_COLUMNS } from './constants';
 import { formatTableField } from '@/utils/tools';
 import { postSubAccount, postAddSubAccount } from '@/api/all/propertyMarketing';
 import { useTableSelectionWithPagination } from '@/hooks/useTableSelectionWithPagination';
+import { Modal } from 'ant-design-vue';
 
 const emits = defineEmits('confirm');
 const update = inject('update');
@@ -207,3 +210,4 @@ defineExpose({ open });
 <style lang="scss">
 @import './style.scss';
 </style>
+

src/views/writer-material-center/components/finished-products/manuscript/check-list/components/manuscript-check-table/delete-manuscript-modal.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model:visible="visible" title="删除内容稿件" width="480px" @close="onClose">
+  <Modal v-model:open="visible" title="删除内容稿件" width="480px" @cancel="onClose" centered>
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认删除 {{ projectName }} 这个内容稿件吗？</span>
@@ -8,12 +8,12 @@
       <Button @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" danger @click="onDelete">确认删除</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { deleteWorkWriter } from '@/api/all/generationWorkshop-writer.ts';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 

src/views/writer-material-center/components/finished-products/manuscript/check/cancel-check-modal.vue

@@ -1,6 +1,8 @@
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
+    @cancel="onClose"
+    centered
     :title="action === 'exit' ? '退出审核' : '切换内容稿件'"
     width="480px"
     @close="onClose"
@@ -19,7 +21,7 @@
         {{ action === 'exit' ? '确认退出' : '确认切换' }}
       </Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>

src/views/writer-material-center/components/finished-products/manuscript/check/check-success-modal.vue

@@ -1,10 +1,12 @@
 <template>
-  <a-modal
+  <Modal
-    v-model:visible="visible"
+    v-model:open="visible"
+    @cancel="onClose"
+    centered
     title="提示"
     width="480px"
     @close="onClose"
-    modal-class="upload-success11-modal"
+    wrapClassName="upload-success11-modal"
     :footer="null"
   >
     <div class="flex items-center flex-col justify-center">
@@ -13,10 +15,12 @@
       <!-- <p class="text-14px lh-22px font-400 color-#737478 ld">想让内容更抓眼球、更吸流量吗？</p>
       <p class="text-14px lh-22px font-400 color-#737478 ld">试试「内容稿件分析」功能吧！</p> -->
     </div>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
+// 添加Modal导入
+import { Modal } from 'ant-design-vue';
 import { ref, onUnmounted } from 'vue';
 import icon1 from '@/assets/img/media-account/icon-feedback-success.png';
 

src/views/writer-material-center/components/finished-products/manuscript/components/upload-manuscript-modal/index.vue

@@ -1,13 +1,6 @@
 <script lang="jsx">
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
-import {
+import { Form, FormItem, Upload, Message as AMessage, Textarea } from '@arco-design/web-vue';
-  Modal,
-  Form,
-  FormItem,
-  Upload,
-  Message as AMessage,
-  Textarea,
-} from '@arco-design/web-vue';
 import {
   getTemplateUrlWriter,
   postWorksByLinkWriter,
@@ -304,9 +297,7 @@ export default {
         ),
         [TASK_STATUS.DEFAULT]: () => (
           <>
-            <Button onClick={onClose}>
+            <Button onClick={onClose}>取消</Button>
-              取消
-            </Button>
             <Button type="primary" onClick={onSubmit}>
               确认
             </Button>
@@ -314,9 +305,7 @@ export default {
         ),
         [TASK_STATUS.FAILED]: () => (
           <>
-            <Button onClick={onClose}>
+            <Button onClick={onClose}>取消</Button>
-              取消
-            </Button>
             <Button type="primary" onClick={onClose}>
               重新上传
             </Button>
@@ -324,9 +313,7 @@ export default {
         ),
         [TASK_STATUS.SUCCESS]: () => (
           <>
-            <Button onClick={onClose}>
+            <Button onClick={onClose}>取消</Button>
-              取消
-            </Button>
             <Button type="primary" onClick={goUpload}>
               确认
             </Button>
@@ -341,13 +328,13 @@ export default {
 
     return () => (
       <Modal
-        v-model:visible={visible.value}
+        v-model:open={visible.value}
         title={getTitle()}
-        modal-class="upload-manuscript-modal"
+        wrapClassName="upload-manuscript-modal"
         width="500px"
-        mask-closable={false}
+        maskClosable={false}
         unmount-on-close
-        onClose={onClose}
+        onCancel={onClose}
         footer={!(isDefault.value && isLocal.value)}
         v-slots={{
           footer: () => renderFooterButtons(),

src/views/writer-material-center/components/finished-products/manuscript/edit/cancel-edit-modal.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model:visible="visible" title="退出编辑" width="480px" @close="onClose">
+  <Modal v-model:open="visible" title="退出编辑" width="480px" @cancel="onClose" centered>
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>内容已修改尚未保存，若退出编辑，本次修改将不保存。</span>
@@ -8,12 +8,12 @@
       <Button @click="onClose">继续编辑</Button>
       <Button type="primary" class="ml-8px" @click="onConfirm">确认退出</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 
 const router = useRouter();

src/views/writer-material-center/components/finished-products/manuscript/list/components/manuscript-table/delete-manuscript-modal.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model:visible="visible" title="删除稿件" width="480px" @close="onClose">
+  <Modal v-model:open="visible" title="删除稿件" width="480px" centered @cancel="onClose">
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认删除 {{ projectName }} 这个稿件吗？</span>
@@ -8,12 +8,12 @@
       <Button size="large" @click="onClose">取消</Button>
       <Button type="primary" class="ml-16px" danger size="large" @click="onDelete">确认删除</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { deleteWorkWriter } from '@/api/all/generationWorkshop-writer.ts';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 
@@ -52,3 +52,16 @@ async function onDelete() {
 
 defineExpose({ open });
 </script>
+
+<template>
+  <Modal v-model:open="visible" title="删除稿件" width="480px" @cancel="onClose" centered>
+    <div class="flex items-center">
+      <img :src="icon1" width="20" height="20" class="mr-12px" />
+      <span>确认删除 {{ projectName }} 这个稿件吗？</span>
+    </div>
+    <template #footer>
+      <Button size="large" @click="onClose">取消</Button>
+      <Button type="primary" class="ml-16px" danger size="large" @click="onDelete">确认删除</Button>
+    </template>
+  </Modal>
+</template>

src/views/writer-material-center/components/finished-products/manuscript/upload/cancel-upload-modal.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-modal v-model:visible="visible" title="确认提示" width="480px" @close="onClose">
+  <Modal v-model:open="visible" title="确认提示" width="480px" @cancel="onClose" centered>
     <div class="flex items-center">
       <img :src="icon1" width="20" height="20" class="mr-12px" />
       <span>确认取消上传这 {{ num }} 个文件吗？此操作不可恢复。</span>
@@ -8,12 +8,12 @@
       <Button @click="onClose">继续编辑</Button>
       <Button type="primary" class="ml-8px" @click="onConfirm">确认取消</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import icon1 from '@/assets/img/media-account/icon-warn-1.png';
 
 const router = useRouter();

src/views/writer-material-center/components/finished-products/manuscript/upload/upload-success-modal.vue

@@ -1,5 +1,12 @@
 <template>
-  <a-modal v-model:visible="visible" title="提示" width="480px" @close="onClose" modal-class="upload-success11-modal">
+  <Modal
+    v-model:open="visible"
+    title="提示"
+    width="480px"
+    @cancel="onClose"
+    wrapClassName="upload-success11-modal"
+    centered
+  >
     <div class="flex items-center flex-col justify-center">
       <img :src="icon1" width="80" height="80" class="mb-16px" />
       <span class="text-18px lh-26px font-400 color-#211F24 md">上传成功</span>
@@ -10,12 +17,12 @@
       <Button @click="onBack">回到列表</Button>
       <Button type="primary" class="ml-8px" @click="onConfirm">批量审核</Button>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Modal } from 'ant-design-vue';
 import { slsWithCatch } from '@/utils/stroage.ts';
 import icon1 from '@/assets/img/media-account/icon-feedback-success.png';