feat: 导入账号后轮询任务状态

This commit is contained in:
rd
2025-07-18 14:43:19 +08:00
parent 69c7415aea
commit 5063cd50f8
8 changed files with 100 additions and 52 deletions

View File

@ -22,16 +22,12 @@ import {
import TagSelect from '@/views/property-marketing/media-account/components/tag-select';
import GroupSelect from '@/views/property-marketing/media-account/components/group-select';
import AuthorizedAccountModal from '../authorized-account-modal';
import ImportPromptModal from '../import-prompt-modal';
// import ImportPromptModal from '../import-prompt-modal';
import StatusBox from '../status-box';
import SyncDataModal from '../sync-data-modal';
import icon1 from '@/assets/img/media-account/icon-download.png';
import icon2 from '@/assets/img/media-account/icon-delete.png';
import icon3 from '@/assets/img/media-account/icon-dy.png';
import icon4 from '@/assets/img/media-account/icon-xhs.png';
import icon5 from '@/assets/img/media-account/icon-warn-1.png';
import icon6 from '@/assets/img/media-account/icon-success.png';
import { downloadByUrl } from '@/utils/tools';
import { showExportNotification } from '@/utils/arcoD';
import {
fetchAccountTags,
fetchAccountGroups,
@ -42,6 +38,13 @@ import {
batchMediaAccounts,
} from '@/api/all/propertyMarketing';
import icon1 from '@/assets/img/media-account/icon-download.png';
import icon2 from '@/assets/img/media-account/icon-delete.png';
import icon3 from '@/assets/img/media-account/icon-dy.png';
import icon4 from '@/assets/img/media-account/icon-xhs.png';
import icon5 from '@/assets/img/media-account/icon-warn-1.png';
import icon6 from '@/assets/img/media-account/icon-success.png';
const UploadStatus = {
DEFAULT: 'default',
WAITING: 'waiting',
@ -77,7 +80,6 @@ export default {
const form = ref({ ...INITIAL_FORM });
const syncDataModalRef = ref(null);
const importLoading = ref(false);
const CustomNotificationVisible = ref(false);
const rules = {
mobile: [
@ -132,6 +134,7 @@ export default {
function removeFile() {
fileName.value = '';
file.value = null;
importLoading.value = false;
uploadStatus.value = UploadStatus.DEFAULT;
}
const reset = () => {
@ -175,22 +178,20 @@ export default {
AMessage.warning('请上传要导入的文件');
return;
}
importLoading.value = true;
const formData = new FormData();
formData.append('file', file.value);
const { code } = await batchMediaAccounts(formData, {
const { code, data } = await batchMediaAccounts(formData, {
headers: {
'Content-Type': 'multipart/form-data',
},
});
if (code === 200) {
AMessage.success('导入成功');
emit('update');
const ID = 'IMPORT-ACCOUNT';
showExportNotification(`正在导入“${file.value.name}”,请稍后...`, ID);
emit('startQueryTaskStatus', data.id, ID);
onClose();
// const ID = 'IMPORT-ACCOUNT';
// renderNotification(ID);
importPromptModalRef.value.open();
} else {
uploadStatus.value = UploadStatus.ERROR;
}
@ -247,9 +248,6 @@ export default {
window.open(data.download_url, '_blank');
}
};
const handleDownloadError = () => {
console.log('handleDownloadError');
};
const renderLabel = (label, tooltipContent) => {
return (
<>
@ -260,31 +258,6 @@ export default {
</>
);
};
const renderNotification = (id, hasError) => {
Notification.warning({
id,
showIcon: false,
closable: true,
content: (
<div>
<div class="flex items-center mb-4px">
<img src={hasError ? icon5 : icon6} width="16" height="16" class="mr-8px" />
<span class="text-16px lh-24px font-400 color-#211F24">导入完成</span>
</div>
<p class="text-14px lh-22px font-400 color-#211F24">
共导入 37 个账号导入成功 32 {hasError ? `,失败 <span class="color-#F64B31">5</span> 个` : ''}
</p>
{hasError && (
<div class="mt-8px text-14px lh-22px font-400 color-#6D4CFE cursor-pointer" onClick={handleDownloadError}>
下载问题表格
</div>
)}
</div>
),
duration: 3000,
class: `px-16px py-16px w-400px rounded-2px ${hasError ? 'bg-#FFF7E5' : 'bg-#EBF7F2'}`,
});
};
expose({ open });
@ -452,7 +425,7 @@ export default {
</div>
<AuthorizedAccountModal ref={authorizedAccountModalRef} onUpdate={() => emit('update')} />
<ImportPromptModal ref={importPromptModalRef} />
{/* <ImportPromptModal ref={importPromptModalRef} /> */}
<SyncDataModal ref={syncDataModalRef} />
</Modal>
);