paimaide/src/App.vue

<template>
    <vant-config-provider :theme="store.isDark ? 'dark' : 'light'">
        <ion-app>
            <ion-router-outlet />
        </ion-app>
    </vant-config-provider>
    <!-- <img id="btn-customer" src="@/assets/icon_custumer.png" @click="onClick" /> -->
</template>

<script setup>
import { ConfigProvider as VantConfigProvider, showConfirmDialog } from 'vant'
import { useBackButton, useIonRouter } from '@ionic/vue'
import { onMounted, onBeforeUnmount } from 'vue'
import { useRoute } from 'vue-router'
import { useSystemStore } from './stores/system'
import { App } from '@capacitor/app'
import { useSettingsStore } from '@/stores/settings'
import { useI18n } from 'vue-i18n'
import { emitter } from '@/utils/eventBus'
import taost from '@/utils/toast'

const store = useSettingsStore()
const { t } = useI18n()
const ionRouter = useIonRouter()
const route = useRoute()

const promptLogin = async () => {
    const confirm = await showConfirmDialog({
        title: t('common.alert'),
        message: t('user.notLogin')
    }).catch(() => {})
    if (confirm) {
        ionRouter.push({ name: 'login' })
    }
}
const promptExit = () => {
    taost(t('common.exitApp'))
}
useBackButton(-1, () => {
    if (route.matched[0].name === 'index') {
        promptExit()
    } else if (!ionRouter.canGoBack()) {
        promptExit()
    }
})
onMounted(() => {
    useSystemStore().getSysConfigs()
    emitter.on('promptLogin', promptLogin)
})
onBeforeUnmount(() => {
    emitter.off('promptLogin', promptLogin)
})
</script>
<style lang="less" scoped>
.consult {
    width: 50px;
    height: 50px;
    border-radius: 25px;
    display: inherit;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    pointer-events: initial;
    background-size: 130% 130%;
    transition: all 0.2s ease-in-out 0s;
    position: relative;
    color: white;
    background: linear-gradient(135deg, rgb(64, 29, 186), rgb(130, 91, 240));
    box-shadow: rgb(64 29 186 / 50%) 0px 4px 24px;
    position: fixed;
    right: 16px;
    bottom: 56px;
    ion-icon {
        font-size: 24px;
    }
}
#btn-customer {
    position: fixed;
    right: 10px;
    width: 48px;
    height: 48px;
    bottom: calc(var(--ion-safe-area-bottom) + 68px);
}
</style>