fix:提示修改为对话框

This commit is contained in:
zhonghua 2026-04-14 16:37:45 +08:00
parent a574fb4826
commit 4d64dd9178

View File

@ -127,7 +127,7 @@ export default { name: 'WelcomeView' }
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, onActivated, watch } from 'vue' import { createVNode, onMounted, onActivated, watch } from 'vue'
import { useRoute, useRouter } from 'vue-router' import { useRoute, useRouter } from 'vue-router'
import { import {
CameraOutlined, CameraOutlined,
@ -140,8 +140,9 @@ import {
BookOutlined, BookOutlined,
RocketOutlined, RocketOutlined,
StarOutlined, StarOutlined,
ExclamationCircleOutlined,
} from '@ant-design/icons-vue' } from '@ant-design/icons-vue'
import { message } from "ant-design-vue" import { Modal } from 'ant-design-vue'
import { useAicreateStore } from '@/stores/aicreate' import { useAicreateStore } from '@/stores/aicreate'
import { loadExtractDraft } from '@/utils/aicreate/extractDraft' import { loadExtractDraft } from '@/utils/aicreate/extractDraft'
import { resumeLeaiWorkFromApi } from '@/utils/aicreate/resumeLeaiWork' import { resumeLeaiWorkFromApi } from '@/utils/aicreate/resumeLeaiWork'
@ -250,10 +251,21 @@ watch(
const handleStart = () => { const handleStart = () => {
if (!store.sessionToken) return if (!store.sessionToken) return
store.reset() store.reset()
message.warning('温馨提示:本次 AI 绘本创作体验功能,仅面向 “智创未来” 广东省 AI 绘本创作活动参与者开放,每个手机号可使用两次。');
setTimeout(() => { // Modal.warning confirm +
router.push('/p/create/upload') Modal.confirm({
}, 600); title: '温馨提示',
icon: createVNode(ExclamationCircleOutlined),
content:
'本次 AI 绘本创作体验功能,仅面向 “智创未来” 广东省 AI 绘本创作活动参与者开放,每个手机号可使用两次。',
okText: '我知道了',
cancelText: '取消',
centered: true,
wrapClassName: 'welcome-tip-modal',
onOk() {
router.push('/p/create/upload')
},
})
} }
</script> </script>
@ -517,3 +529,43 @@ $gradient: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #ec4899 100%);
text-shadow: 0 1px 4px rgba(248, 247, 252, 0.9); text-shadow: 0 1px 4px rgba(248, 247, 252, 0.9);
} }
</style> </style>
<style lang="scss">
/* Modal.confirm 挂载在 body需非 scoped */
.welcome-tip-modal {
// .ant-modal-confirm-body-wrapper {
// display: flex;
// flex-direction: column;
// align-items: center;
// }
// .ant-modal-confirm-body {
// display: flex;
// flex-direction: column;
// align-items: center;
// text-align: center;
// }
// .ant-modal-confirm-body > .anticon {
// margin-inline-end: 0 !important;
// margin-bottom: 4px;
// font-size: 22px;
// }
.ant-modal-confirm-title {
display: block;
width: 100%;
}
.ant-modal-confirm-content {
margin-top: 8px;
}
.ant-modal-confirm-btns {
display: flex;
justify-content: center;
width: 100%;
margin-top: 8px;
}
}
</style>