diff --git a/src/api/all/propertyMarketing.ts b/src/api/all/propertyMarketing.ts index cc01d23..fe8d6cd 100644 --- a/src/api/all/propertyMarketing.ts +++ b/src/api/all/propertyMarketing.ts @@ -95,3 +95,13 @@ export const deleteTag = (id: string) => { export const batchDeleteMediaAccounts = (params = {}) => { return Http.delete(`/v1/media-accounts/batch`, params); }; + +// 媒体账号-批量标签 +export const batchPutTag = (params = {}) => { + return Http.put(`/v1/media-accounts/batch-tag`, params); +}; + +// 媒体账号-批量分组 +export const batchPutGroup = (params = {}) => { + return Http.put(`/v1/media-accounts/batch-group`, params); +}; diff --git a/src/assets/img/icon-question.png b/src/assets/img/icon-question.png new file mode 100644 index 0000000..a10d6ad Binary files /dev/null and b/src/assets/img/icon-question.png differ diff --git a/src/views/property-marketing/component.scss b/src/views/property-marketing/component.scss index 6fcacb8..6595010 100644 --- a/src/views/property-marketing/component.scss +++ b/src/views/property-marketing/component.scss @@ -12,19 +12,30 @@ } } .arco-modal { + .cancel-btn { + border-radius: 4px; + border: 1px solid var(--BG-500, #b1b2b5); + background: var(--BG-white, #fff); + &:hover { + border: 1px solid var(--BG-500, #b1b2b5); + } + } .arco-modal-header { - border-bottom: none; + border-bottom: 1px solid var(--Border-1, #d7d7d9); height: 56px; - padding: 22px 24px 16px 24px; + padding: 0 20px; .arco-modal-title { justify-content: flex-start; } } .arco-modal-body { - padding: 24px 24px 20px; + padding: 24px 20px; .arco-form-item { margin-bottom: 16px; + &:last-child { + margin-bottom: 0; + } .arco-form-item-label { color: var(--Text-1, #211f24); font-family: 'Alibaba PuHuiTi'; @@ -34,15 +45,14 @@ line-height: 22px; /* 157.143% */ } } - .cancel-btn { - border-radius: 4px; - border: 1px solid var(--BG-500, #b1b2b5); - background: var(--BG-white, #fff); - } } .arco-modal-footer { - border-top: none; - padding: 0; + display: flex; + height: 64px; + padding: 0px 20px; + justify-content: flex-end; + align-items: center; + border-top: 1px solid var(--Border-1, #d7d7d9); } } diff --git a/src/views/property-marketing/media-account/account-manage/components/account-table/delete-account.vue b/src/views/property-marketing/media-account/account-manage/components/account-table/delete-account.vue index ccc91bf..f1752be 100644 --- a/src/views/property-marketing/media-account/account-manage/components/account-table/delete-account.vue +++ b/src/views/property-marketing/media-account/account-manage/components/account-table/delete-account.vue @@ -11,20 +11,19 @@ v-model:visible="visible" :title="isBatch ? '批量删除账号' : '删除账号'" width="400px" - :footer="false" modal-class="account-manage-modal" @close="onClose" > -
+
确认删除 {{ accountName }} 这个账号吗?
-
+ diff --git a/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue b/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue index 2a9edef..6ff4a14 100644 --- a/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue +++ b/src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue @@ -7,7 +7,6 @@ v-model:visible="visible" :title="isEdit ? '编辑账号' : '添加账号'" modal-class="add-account-modal" - :footer="false" width="500px" :mask-closable="false" > @@ -82,14 +81,13 @@ - -
- 取消 - - {{ isBatchImport ? '确定导入' : '生成授权码' }} - -
+ diff --git a/src/views/property-marketing/media-account/account-manage/components/batch-group-modal/index.vue b/src/views/property-marketing/media-account/account-manage/components/batch-group-modal/index.vue new file mode 100644 index 0000000..21f7de8 --- /dev/null +++ b/src/views/property-marketing/media-account/account-manage/components/batch-group-modal/index.vue @@ -0,0 +1,142 @@ + + + + + + diff --git a/src/views/property-marketing/media-account/account-manage/components/batch-group-modal/style.scss b/src/views/property-marketing/media-account/account-manage/components/batch-group-modal/style.scss new file mode 100644 index 0000000..acb2b4c --- /dev/null +++ b/src/views/property-marketing/media-account/account-manage/components/batch-group-modal/style.scss @@ -0,0 +1,16 @@ +@import '@/views/property-marketing/component.scss'; + +.batch-group-modal { + border-radius: 8px; + .arco-modal-body { + // min-height: 200px; + .t1 { + color: var(--Text-3, #737478); + font-family: 'Alibaba PuHuiTi'; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 22px; /* 157.143% */ + } + } +} diff --git a/src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/index.vue b/src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/index.vue new file mode 100644 index 0000000..99cfceb --- /dev/null +++ b/src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/index.vue @@ -0,0 +1,171 @@ + + + + + + diff --git a/src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/style.scss b/src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/style.scss new file mode 100644 index 0000000..156b9c4 --- /dev/null +++ b/src/views/property-marketing/media-account/account-manage/components/batch-tag-modal/style.scss @@ -0,0 +1,16 @@ +@import '@/views/property-marketing/component.scss'; + +.batch-tag-modal { + border-radius: 8px; + .arco-modal-body { + // min-height: 200px; + .t1 { + color: var(--Text-3, #737478); + font-family: 'Alibaba PuHuiTi'; + font-size: 14px; + font-style: normal; + font-weight: 400; + line-height: 22px; /* 157.143% */ + } + } +} diff --git a/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/add-group.vue b/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/add-group.vue index 9781d48..d208936 100644 --- a/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/add-group.vue +++ b/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/add-group.vue @@ -8,18 +8,17 @@ :title="isEdit ? '编辑分组' : '添加新分组'" modal-class="account-manage-modal" width="400px" - :footer="false" @close="onClose" > -
- 取消 - 确认 -
+ diff --git a/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/delete-group.vue b/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/delete-group.vue index 30a3270..8d19023 100644 --- a/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/delete-group.vue +++ b/src/views/property-marketing/media-account/account-manage/components/group-manage-modal/delete-group.vue @@ -3,24 +3,17 @@ * @Date: 2025-06-26 11:45:05 --> diff --git a/src/views/property-marketing/media-account/account-manage/components/import-prompt-modal/index.vue b/src/views/property-marketing/media-account/account-manage/components/import-prompt-modal/index.vue index 7b67178..5fd6c1e 100644 --- a/src/views/property-marketing/media-account/account-manage/components/import-prompt-modal/index.vue +++ b/src/views/property-marketing/media-account/account-manage/components/import-prompt-modal/index.vue @@ -8,7 +8,6 @@ width="480px" title="导入提示" modal-class="import-prompt-modal" - :footer="false" :mask-closable="false" @close="close" > @@ -17,12 +16,11 @@ 账号已成功导入,当前为未授权状态。请前往卡片列表手动授权,完成授权后账号可正常使用。
- -
- 取消 - 去授权 -
+ diff --git a/src/views/property-marketing/media-account/account-manage/index.vue b/src/views/property-marketing/media-account/account-manage/index.vue index dc376ca..bc6fe2f 100644 --- a/src/views/property-marketing/media-account/account-manage/index.vue +++ b/src/views/property-marketing/media-account/account-manage/index.vue @@ -104,6 +104,8 @@ + + @@ -116,6 +118,8 @@ import GroupManageModal from './components/group-manage-modal'; import TagsManageModal from './components/tags-manage-modal'; import AddAccountModal from './components/add-account-modal'; import DeleteAccountModal from './components/account-table/delete-account'; +import BatchTagModal from './components/batch-tag-modal'; +import BatchGroupModal from './components/batch-group-modal'; import { INITIAL_QUERY } from './constants'; import { getMediaAccounts } from '@/api/all/propertyMarketing'; @@ -131,6 +135,8 @@ const groupManageModalRef = ref(null); const tagsManageModalRef = ref(null); const addAccountModalRef = ref(null); const deleteAccountRef = ref(null); +const batchTagModalRef = ref(null); +const batchGroupModalRef = ref(null); const tipStatus = ref(2); const pageInfo = reactive({ @@ -266,6 +272,13 @@ const handleDelete = (item) => { const handleCloseTip = () => { selectedItems.value = []; }; + +const handleBatchTag = () => { + batchTagModalRef.value?.open(selectedItems.value); +}; +const handleBatchGroup = () => { + batchGroupModalRef.value?.open(selectedItems.value); +};