aslan-h5/src/views/payResult.vue

114 lines
2.7 KiB
Vue

<template>
<div class="pay-result">
<div class="head">
<div class="content">
<div v-if="appStatus === 0">
<div class="icon">
<van-icon name="checked" size="2rem" color="#0ad4af" />
</div>
<div class="ok">{{ getI18n('paySuccess') }}</div>
<div class="msg">{{ getI18n('payMsg') }}</div>
</div>
<div v-if="appStatus === 1">
<div class="icon">
<van-icon name="clear" size="2rem" color="#FF682E" />
</div>
<div class="ok">{{ getI18n('payFail') }}</div>
</div>
<div class="switch-lang">
<!-- <select v-model="selectedLange" @change="changeLange">
<option v-for="(item, index) in langCountrys" :key="index" :value="item.value">
{{ item.name }}
</option>
</select> -->
</div>
</div>
</div>
<div class="bottom">
<div class="colse" @click="closePage()">{{ getI18n('close') }}</div>
</div>
</div>
</template>
<script setup>
import { showError, showWarning, showInfo, showSuccess } from '@/utils/toast.js'
import { onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import { useI18n } from 'vue-i18n'
const route = useRoute()
const query = route.query || {}
const appStatus = ref(Number(query.appStatus)) // 0 成功, 1 失败
const appType = ref(query.appType)
const appId = ref(query.appId)
const redirect = ref(query.redirect)
const closePage = () => {
location.href = `${location.origin}/#/${redirect.value}/${appId.value}?type=${appType.value}`
}
// const changeLange = (event) => {
// store.dispatch('app/setLanguage', selectedLange.value)
// sysLange.value = selectedLange.value
// }
const { t } = useI18n()
const getI18n = (field) => {
return t(`${field}`)
}
onMounted(() => {})
</script>
<style scoped lang="scss">
* {
color: black;
}
.pay-result {
background: #ffffff;
min-height: 100%;
.head {
.content {
.switch-lang {
margin-top: 0.5rem;
font-size: 0.32rem;
position: relative;
text-align: center;
.down-icon {
position: absolute;
}
}
.icon {
text-align: center;
padding: 0.5rem 0rem 0rem 0rem;
}
.ok {
text-align: center;
font-size: 0.6rem;
}
.msg {
text-align: center;
font-size: 0.35rem;
padding-top: 0.2rem;
}
}
}
.bottom {
height: 1.2rem;
width: 100%;
margin-top: 0.5rem;
.colse {
margin: auto;
color: #ffffff;
width: 4.5rem;
height: 1rem;
font-size: 0.4rem;
text-align: center;
line-height: 1rem;
background: #0ad4af;
border-radius: 0.2rem;
}
}
}
</style>