diff --git a/mini-program/src/pages/onboarding/tag-manage.vue b/mini-program/src/pages/onboarding/tag-manage.vue index 56e65a2..203d77a 100644 --- a/mini-program/src/pages/onboarding/tag-manage.vue +++ b/mini-program/src/pages/onboarding/tag-manage.vue @@ -42,6 +42,15 @@ + + @@ -49,11 +58,16 @@ import { computed, onMounted, reactive, ref } from 'vue' import { useAppStore } from '../../stores/app.js' import { useMenuButtonSafeArea } from '../../composables/useMenuButtonSafeArea.js' +import TagDialog from '../../components/TagDialog.vue' const store = useAppStore() const { capsuleTopReservePx } = useMenuButtonSafeArea({ extraTopPx: 2 }) const type = ref('personality') +const dialogVisible = ref(false) +const dialogTitle = ref('确认删除') +const dialogContent = ref('') +const pendingTag = ref(null) const library = ref([]) const selected = ref([]) const swipeOffsets = reactive({}) @@ -125,17 +139,31 @@ const onTouchEnd = (event, index) => { } /** - * 删除确认 + * 打开删除确认弹窗 */ const confirmDelete = (tag) => { - uni.showModal({ - title: '确认删除', - content: `确定删除「${tag}」吗?删除后不可恢复`, - success: (res) => { - if (!res.confirm) return - deleteTag(tag) - } - }) + pendingTag.value = tag + dialogContent.value = `确定删除「${tag}」吗?删除后不可恢复` + dialogVisible.value = true +} + +/** + * 弹窗确认回调 + */ +const onDialogConfirm = () => { + if (pendingTag.value) { + deleteTag(pendingTag.value) + pendingTag.value = null + } + dialogVisible.value = false +} + +/** + * 弹窗取消回调 + */ +const onDialogCancel = () => { + pendingTag.value = null + dialogVisible.value = false } /** @@ -311,6 +339,9 @@ onMounted(() => { .tag-text { color: rgba(255, 255, 255, 0.9); font-size: 26rpx; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .tag-row-delete {