feat: button组件替换
This commit is contained in:
rd
@ -1,4 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
const router = useRouter();
|
||||
const back = () => {
|
||||
router.replace('/');
|
||||
@ -8,8 +11,8 @@ const back = () => {
|
||||
<template>
|
||||
<div class="content">
|
||||
<a-result class="result" status="404" subtitle="页面跑路了" />
|
||||
<div class="operation-row">
|
||||
<a-button key="back" type="primary" @click="back">返回</a-button>
|
||||
<div class="operation-row flex justify-center">
|
||||
<Button key="back" type="primary" @click="back">返回</Button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -3,13 +3,14 @@
|
||||
* @Date: 2025-06-26 17:23:52
|
||||
-->
|
||||
<template>
|
||||
<a-modal
|
||||
v-model:visible="visible"
|
||||
<Modal
|
||||
v-model:open="visible"
|
||||
width="400px"
|
||||
modal-class="exit-account-modal"
|
||||
wrapClassName="exit-account-modal"
|
||||
show-close="false"
|
||||
:footer="false"
|
||||
@close="onClose"
|
||||
@cancel="onClose"
|
||||
centered
|
||||
>
|
||||
<div class="flex items-center mb-16px">
|
||||
<img :src="icon1" width="20" height="20" class="mr-12px" />
|
||||
@ -17,15 +18,14 @@
|
||||
</div>
|
||||
<p class="m-0 p-0 mb-24px s2 ml-32px">退出登录后，你将无法收到该账号的通知</p>
|
||||
<div class="flex items-center justify-end">
|
||||
<a-button class="!rounded-4px" size="medium" @click="onClose">返回</a-button>
|
||||
<a-button type="primary" class="ml-16px danger-btn" status="danger" size="medium" @click="onLogout"
|
||||
>退出登录</a-button
|
||||
>
|
||||
<Button @click="onClose">返回</Button>
|
||||
<Button danger type="primary" @click="onLogout" class="ml-8px">退出登录</Button>
|
||||
</div>
|
||||
</a-modal>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Modal, Button } from 'ant-design-vue';
|
||||
import { ref } from 'vue';
|
||||
import { fetchLogOut } from '@/api/all/login';
|
||||
import { handleUserLogout } from '@/utils/user';
|
||||
@ -56,14 +56,14 @@ defineExpose({ open });
|
||||
|
||||
<style lang="scss">
|
||||
.exit-account-modal {
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--BG-300, #e6e6e8) !important;
|
||||
background-color: var(--BG-white, #fff) !important;
|
||||
box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
|
||||
.arco-modal-header {
|
||||
// border-radius: 8px;
|
||||
// border: 1px solid var(--BG-300, #e6e6e8) !important;
|
||||
// background-color: var(--BG-white, #fff) !important;
|
||||
// box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
|
||||
.ant-modal-header {
|
||||
display: none;
|
||||
}
|
||||
.arco-modal-body {
|
||||
.ant-modal-body {
|
||||
padding: 24px;
|
||||
.s1 {
|
||||
color: var(--Text-1, #211f24);
|
||||
@ -81,15 +81,6 @@ defineExpose({ open });
|
||||
font-weight: 400;
|
||||
line-height: 20px; /* 166.667% */
|
||||
}
|
||||
.cancel-btn {
|
||||
border-radius: 4px;
|
||||
}
|
||||
.danger-btn {
|
||||
background: var(--Functional-Danger-6, #f64b31) !important;
|
||||
&:hover {
|
||||
background: var(--Functional-Danger-6, #f64b31) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,24 +1,24 @@
|
||||
<template>
|
||||
<a-modal
|
||||
v-model:visible="visible"
|
||||
<Modal
|
||||
v-model:open="visible"
|
||||
:title="isBatch ? '批量删除下载记录' : '删除下载记录'"
|
||||
width="400px"
|
||||
@close="onClose"
|
||||
@cancel="onClose"
|
||||
centered
|
||||
>
|
||||
<div class="flex items-center">
|
||||
<img :src="icon1" width="20" height="20" class="mr-12px" />
|
||||
<span>确认删除 {{ accountName }} 这条记录吗？</span>
|
||||
</div>
|
||||
<template #footer>
|
||||
<a-button size="large" @click="onClose">取消</a-button>
|
||||
<a-button type="primary" class="ml-16px !bg-#f64b31 !border-none" status="danger" size="large" @click="onDelete"
|
||||
>确定</a-button
|
||||
>
|
||||
<Button @click="onClose">取消</Button>
|
||||
<Button type="primary" danger @click="onDelete">确定</Button>
|
||||
</template>
|
||||
</a-modal>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Modal, Button } from 'ant-design-vue';
|
||||
import { ref } from 'vue';
|
||||
import { deleteTask, deleteBatchTasks } from '@/api/all/common';
|
||||
import icon1 from '@/assets/img/media-account/icon-warn-1.png';
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
<script lang="jsx">
|
||||
import { ref, computed } from 'vue';
|
||||
import { Input, Table, TableColumn, Checkbox, Pagination, Button, Tooltip, Notification } from '@arco-design/web-vue';
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Input, Table, TableColumn, Checkbox, Pagination, Tooltip, Notification } from '@arco-design/web-vue';
|
||||
import { IconSearch, IconClose, IconQuestionCircle } from '@arco-design/web-vue/es/icon';
|
||||
import NoData from '@/components/no-data';
|
||||
import { getTask, postRedoTask, postBatchDownload, batchQueryTaskStatus } from '@/api/all/common';
|
||||
@ -343,7 +344,7 @@ export default {
|
||||
onClick={() => handleDelete(record)}
|
||||
/>
|
||||
{record.status !== enumTaskStatus.Exporting && (
|
||||
<Button type="outline" size="mini" class="search-btn" onClick={() => handleDownload(record)}>
|
||||
<Button type="primary" ghost size="small" class="search-btn" onClick={() => handleDownload(record)}>
|
||||
{record.status === enumTaskStatus.Failed ? '重新导出' : '下载'}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
@ -1,25 +1,25 @@
|
||||
<template>
|
||||
<a-modal
|
||||
v-model:visible="visible"
|
||||
<Modal
|
||||
v-model:open="visible"
|
||||
:title="isBatch ? '批量删除导入记录' : '删除导入记录'"
|
||||
width="400px"
|
||||
@close="onClose"
|
||||
centered
|
||||
@cancel="onClose"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
<img :src="icon1" width="20" height="20" class="mr-12px" />
|
||||
<span>确认删除 {{ accountName }} 这条记录吗？</span>
|
||||
</div>
|
||||
<template #footer>
|
||||
<a-button size="large" @click="onClose">取消</a-button>
|
||||
<a-button type="primary" class="ml-16px !bg-#f64b31 !border-none" status="danger" size="large" @click="onDelete"
|
||||
>确定</a-button
|
||||
>
|
||||
<Button @click="onClose">取消</Button>
|
||||
<Button type="primary" danger @click="onDelete">确定</Button>
|
||||
</template>
|
||||
</a-modal>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { Modal, Button } from 'ant-design-vue';
|
||||
import { deleteTask, deleteBatchTasks } from '@/api/all/common';
|
||||
import icon1 from '@/assets/img/media-account/icon-warn-1.png';
|
||||
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
<script lang="jsx">
|
||||
import { ref, computed } from 'vue';
|
||||
import { Input, Table, TableColumn, Checkbox, Pagination, Button, Tooltip, Notification } from '@arco-design/web-vue';
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Input, Table, TableColumn, Checkbox, Pagination, Tooltip, Notification } from '@arco-design/web-vue';
|
||||
import { IconSearch, IconClose, IconQuestionCircle } from '@arco-design/web-vue/es/icon';
|
||||
import NoData from '@/components/no-data';
|
||||
import { getTask } from '@/api/all/common';
|
||||
@ -257,7 +258,7 @@ export default {
|
||||
onClick={() => handleDelete(record)}
|
||||
/>
|
||||
{record.status === enumTaskStatus.Failed && (
|
||||
<Button type="outline" size="mini" class="search-btn" onClick={() => handleDownload(record)}>
|
||||
<Button type="primary" ghost size="small" class="search-btn" onClick={() => handleDownload(record)}>
|
||||
下载问题表格
|
||||
</Button>
|
||||
)}
|
||||
|
||||
@ -1,12 +1,13 @@
|
||||
<template>
|
||||
<a-modal
|
||||
v-model:visible="visible"
|
||||
<Modal
|
||||
v-model:open="visible"
|
||||
title="任务中心"
|
||||
modal-class="task-center-modal"
|
||||
wrapClassName="task-center-modal"
|
||||
width="860px"
|
||||
:mask-closable="false"
|
||||
:footer="false"
|
||||
@close="onClose"
|
||||
@cancel="onClose"
|
||||
centered
|
||||
>
|
||||
<a-tabs :active-key="activeTab" @tab-click="handleTabClick">
|
||||
<a-tab-pane key="0" title="导入"> </a-tab-pane>
|
||||
@ -15,10 +16,11 @@
|
||||
<div class="content">
|
||||
<component :is="activeTab === '0' ? ImportTask : ExportTask" ref="componentRef" />
|
||||
</div>
|
||||
</a-modal>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Checkbox, Modal, Button } from 'ant-design-vue';
|
||||
import { Notification } from '@arco-design/web-vue';
|
||||
|
||||
import ExportTask from './components/export-task';
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
.task-center-modal {
|
||||
.arco-modal-header {
|
||||
.ant-modal-header {
|
||||
border-bottom: none !important;
|
||||
.arco-modal-title {
|
||||
.ant-modal-title {
|
||||
color: var(--Text-1, #211f24);
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
@ -10,7 +10,7 @@
|
||||
font-family: $font-family-medium;
|
||||
}
|
||||
}
|
||||
.arco-modal-body {
|
||||
.ant-modal-body {
|
||||
padding: 0 !important;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
Reference in New Issue
Block a user